您的位置：首页 > Web前端 > CSS

前端学习笔记（HTML&CSS）（01）

2020-06-06 06:53 309 查看

HTML

从今天开始，会开始记录一下学习前端HTML的相关知识。

什么是HTML

HTML是一种用来描述网页的一种语言
1. HTML：指超文本标记语言，Hyper Text Markup Language；
2. HTML 不是一种编程语言，而是一种标记语言
3. 标记语言是一套标记标签 (markup tag)
4. HTML使用标记标签来描述网页
5. HTML文档包含了HTML 标签及文本内容
6. HTML文档也叫做 web 页面

HTML实例

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>十安的前端学习</title>
</head>

<body>
<h1>十安的标题</h1>
<h2>十安的标题</h2>
<h3>十安的标题</h3>

<p>这是一个段落。</p>
<p>这是另外一个段落。</p>
</body>
</html>

HTML实例分析

HTML文档声明

<!-- 文档声明，声明当前网页的版本 -->
<!DOCTYPE html>

声明有助于浏览器中正确显示网页。
网络上有很多不同的文件，如果能够正确声明HTML的版本，浏览器就能正确显示网页内容。

doctype 声明是不区分大小写的，以下方式均可：

<!DOCTYPE html>
<!DOCTYPE HTML>
<!doctype html>
<!Doctype Html>

HTML标签声明

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
HTML 标签是由尖括号包围的关键词，比如 < html >，
HTML 标签通常是成对出现的，比如 < b > 和 < /b >
标签对中的第一个标签是开始标签，第二个标签是结束标签开始和结束标签也被称为开放标签和闭合标签

<标签> 内容 </标签>

根标签

<!-- html的根标签（元素），网页中的所有内容都要写根元素的里边 -->
<html>
</html>

网页头部标签

<!-- head是网页的头部，head中的内容不会在网页中直接出现，主要用来帮助浏览器或搜索引擎来解析网页 -->
<head>
</head>

字符集标签

<!-- meta标签用来设置网页的元数据，这里meta用来设置网页的字符集，避免乱码问题 -->
<meta charset="utf-8">

标题栏

<!-- title中的内容会显示在浏览器的标题栏，搜索引擎会主要根据title中的内容来判断网页的主要内容 -->
<title>十安的前端学习</title>

实例展示

网页主体

<!-- body是html的子元素，表示网页的主体，网页中所有的可见内容都应该写在body里 -->
<body>
</body>

标题
请确保将 HTML 标题标签只用于标题。不要仅仅是为了生成粗体或大号的文本而使用标题。
搜索引擎使用标题为您的网页的结构和内容编制索引。
因为用户可以通过标题来快速浏览您的网页，所以用标题来呈现文档结构是很重要的。
应该将 h1 用作主标题（最重要的），其后是 h2（次重要的），再其次是 h3，以此类推。

<!-- h1网页的一级标题 -->
<!--HTML 标题（Heading）是通过<h1> - <h6> 标签来定义的。-->
<h1>十安的标题</h1>
<h2>十安的标题</h2>
<h3>十安的标题</h3>

7. 段落

<!--HTML 段落是通过标签 <p> 来定义的。-->
<p>这是一个段落。</p>
<p>这是另外一个段落。</p>

实例展示

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航