HTML 标签语言

概念

　　超文本标记语言，是一种用于创建网页的标记语言。

ps：

　　不是编程语言，是利用标签来描述网页的。

　　扩展名：.html　　.htm

语法规范

标签不区分大小写，推荐小写。
双标签必须写完整（浏览器不会报错，而且自动补全，但是最终效果很大可能性影响整体布局）。
不用标签形式的内容会以完整的原内容进行展示。
合理的注释：""和缩进增加代码的可读性

文档结构

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>css样式优先级</title>
</head>
<body>

</body>
</html>

属性说明

　　<!DOCTYPE html>　　声明为HTML5文档

　　<html></html>　　　　是文档的开始标记和结束的标记。是HTML页面的根元素，在它们之间是文档的头部(head)和主体(body)

　　<head></head>　　　定义了HTML文档的开头部分。它们之间的内容不会在浏览器的文档窗口显示。包含了文档的元(meta)数据。

　　<title></title>　　　　定义了网页标题，在浏览器标题栏显示

　　<body></body>　　　之间的文本是可见的网页主体内容

标签的分类

分类一

　　自闭合标签：单标签。

　　闭合标签：双标签

分类二

　　块级标签：就是独占一行，可以自行设置宽高。ps：div，p，h1-h6。

　　内联标签：按内容占位，高度和广度是由自己的内容填充的。ps：a，br，img。

判断块级标签和内联标签的方法：

是否单独占一行（可以通过设置背景颜色去判断）。
是否可以单独为元素设置高度和宽度。

标签关系

　　标签嵌套会产生祖先和后代，父子，兄弟关系。

父子关系

　　外层：父元素，内层：子元素。

　　在使用嵌套的时候，推荐使用父子结构来实现下拉菜单效果。

祖先和后代

　　外层所有元素统称为：祖先元素。

　　内层元素称为：后代元素。

兄弟关系

　　平级元素之间互为兄弟元素。

head内的常用标签

title

　　设置网页标题。

<title>我的网页</title>

style

　　设置网页的样式。

<style></style>

link

　　引入外部样式表文件

<link />

script

　　引入外部 JS 代码用

<script></script>

body内常用标签

基本标签（内联标签）

　　内联标签不需要另起一行，以文本大小为定义大小。

<b>加粗</b>
<i>斜体</i>
<u>下划线</u>
<s>删除线</s>

<!--换行-->    <br />

<span></span>

基本标签（块级标签）

　　块级标签需要另起一行。

<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>
<!--水平线-->　　<hr />
<div></div>
<p></p>

　　浏览器默认字体大小为 16px, 渲染的时候小于12px 的会强制改成 12px。

　　h1 标签的字体大小为 32px，

　　h4 标签的字体大小为 16px ，

　　h6 标签的字体大小为 12px 。

　　浏览器会对代码文本中的换行和 多余的空格 解析成一个空格 ( 因此会导致格式不对应 )。

文本标签样式

　　默认都是左对齐，此内容可被CSS样式代替。

<h1 align="center/left/right">标题</h1>

div和span的区别

　　<div></div>：<div>只是一个块级元素，并无实际的意义。主要通过CSS样式为其赋予不同的表现。

　　<span></span>：<span>表示了内联行（块级元素），并无实际的意义。主要通过CSS样式为其赋予不同的表现。

ps：
　　p标签是个特异点，不可以嵌套其他块级标签，嵌套p标签也不行。

html - 标签语法