HTML(HyperText Markup Language,超文本标记语言)
HTML 标签不区分大小写。也就是说,输入标签时既可以使用大写字母也可以使用小写字母。例如,标签 <title> 可以写作 <title>、<TITLE>、<Title>、<TiTlE> 等,也都可以正常工作。不过,从一致性、可读性来说,最好仅使用小写字母。
剖析一个 HTML 元素
整个元素即指开始标签、内容、结束标签三部分组成的整体。
块级元素和内联元素
- 块级元素在页面中以块的形式展现。一个块级元素出现在它前面的内容之后的新行上。任何跟在块级元素后面的内容也会出现在新的行上。块级元素通常是页面上的结构元素。例如,一个块级元素可能代表标题、段落、列表、导航菜单或页脚。一个块级元素不会嵌套在一个内联元素里面,但它可能嵌套在另一个块级元素里面。
- 内联元素通常出现在块级元素中并环绕文档内容的一小部分,而不是一整个段落或者一组内容。内联元素不会导致文本换行。它通常与文本一起使用,例如,
<a>元素创建一个超链接,<em>和<strong>等元素创建强调。
空元素
不是所有元素都拥有开始标签、内容和结束标签。一些元素只有一个标签,通常用来在此元素所在位置插入/嵌入一些东西。这些元素被称为空元素。例如:元素 <img> 是用来在页面插入一张指定的图片。
属性
<p class="desc">这是描述</p>
属性包含元素的额外信息,这些信息不会出现在实际的内容中。在上述例子中,这个 class 属性是一个识别名称,以后为元素设置样式信息时更加方便。
布尔属性
下面这两种方式都可以
<input type="text" disabled="disabled" />
<input type="text" disabled />
省略包围属性值的引号
<a href=https://www.mozilla.org/>favorite website</a>
剖析 HTML 文档
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<title>我的测试站点</title>
</head>
<body>
<p>这是我的页面</p>
</body>
</html>
<!DOCTYPE html>: 声明文档类型。<html></html>:<html>元素。这个元素包裹了页面中所有的内容,有时被称为根元素。<head></head>:<head>元素。这个元素是一个容器,它包含了所有你想包含在 HTML 页面中但不在 HTML 页面中显示的内容。这些内容包括你想在搜索结果中出现的关键字和页面描述、CSS 样式、字符集声明等等。<meta charset="utf-8">:<meta>元素。这个元素代表了不能由其他 HTML 元相关元素表示的元数据,比如<base>、<link>、<script>、<style>或<title>。charset属性将你的文档的字符集设置为 UTF-8,其中包括绝大多数人类书面语言的大多数字符。<title></title>:<title>元素。这设置了页面的标题,也就是出现在该页面加载的浏览器标签中的内容。当页面被加入书签时,页面标题也被用来描述该页面。<body></body>:<body>元素。包含了你访问页面时所有显示在页面上的内容,包含文本、图片、视频、游戏、可播放音频轨道等等。
HTML 中的空白
<p>狗 狗 很 呆 萌。</p>
<p>狗 狗 很
呆 萌。</p>
无论你在 HTML 元素的内容中使用多少空格(包括一个或多个空白字符或换行),当渲染这些代码的时候,HTML 解释器会将连续出现的空白字符减少为一个单独的空格符。
实体引用:在 HTML 中包含特殊字符
在 HTML 中,字符 <、>、"、' 和 & 是特殊字符。
| 原义字符 | 等价字符引用 |
|---|---|
| < | < |
| > | > |
| " | " |
| ' | ' |
| & | & |
HTML 注释
为了将一段 HTML 中的内容置为注释,你需要将其用特殊的记号 <!-- 和 --> 包裹起来