1

HTML入门

HTML

什么是HTML

  1. HTML (HyperText Markup Language) 不是一门编程语言,而是一种用来告知浏览器如何组织页面的标记语言。
  2. HTML 可复杂、可简单,一切取决于开发者。它由一系列的元素(elements)组成,这些元素可以用来包围不同部分的内容,使其以某种方式呈现或者工作。
  3. HTML 标签不区分大小写。也就是说,输入标签时既可以使用大写字母也可以使用小写字母。

剖析一个HTML元素

  1. 元素的主要组成部分:开始标签、内容、结束标签
  2. 元素分类:嵌套元素、块级元素、内联元素、空元素。

    • 块级元素:在页面中以块的形式展现,相对于其前面的内容它会出现在新的一行,其后的内容也会被挤到下一行展现。
    • 内联元素:通常出现在块级元素中并环绕文档内容的一小部分,而不是一整个段落或者一组内容。内联元素不会导致文本换行。
    • 空元素:不是所有元素都拥有开始标签,内容,结束标签。一些元素只有一个标签,通常用来在此元素所在位置插入/嵌入一些东西。
  3. 属性:属性包含元素的额外信息,这些信息不会出现在实际的内容中。

    • 布尔属性:原生标签布尔属性的属性名和属性值相同,可缩写
    • 在某些情况下可以省略包围属性值的引号
    • 属性值用单引号或双引号均可,但不能同时出现

剖析一个HTML文档

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>我的测试站点</title>
  </head>
  <body>
    <p>这是我的页面</p>
  </body>
</html>
  1. 元素组成分析:

    • <!DOCTYPE html>: 声明文档类型. 很久以前,早期的HTML(大约1991年2月),文档类型声明类似于链接,规定了HTML页面必须遵从的良好规则,能自动检测错误和其他有用的东西。
    • <html></html>: <html>元素。这个元素包裹了整个完整的页面,是一个根元素。
    • <head></head>: <head>元素. 这个元素是一个容器,它包含了所有你想包含在HTML页面中但不想在HTML页面中显示的内容。这些内容包括你想在搜索结果中出现的关键字和页面描述,CSS样式,字符集声明等等。
    • <meta charset="utf-8">: 这个元素设置文档使用utf-8字符集编码,utf-8字符集包含了人类大部分的文字。基本上他能识别你放上去的所有文本内容。毫无疑问要使用它,并且它能在以后避免很多其他问题。
    • <title></title>: 设置页面标题,出现在浏览器标签上,当你标记/收藏页面时它可用来描述页面。
    • <body></body>: <body>元素。 包含了你访问页面时所有显示在页面上的内容,文本,图片,音频,游戏等等。
  2. HTML中的空白:无论你在HTML元素的内容中使用多少空格(包括空白字符,包括换行),当渲染这些代码的时候,HTML解释器会将连续出现的空白字符减少为一个单独的空格符。

实体引用

在HTML中,字符 <, >,",' 和 & 是特殊字符. 它们是HTML语法自身的一部分, 那么你如何将这些字符包含进你的文本中呢, 比如说如果你真的想要在文本中使用符号&或者小于号, 而不想让它们被浏览器视为代码并被解释?

使用字符引用:表示字符的特殊编码, 它们可以在那些情况下使用. 每个字符引用以符号&开始, 以分号(;)结束。

原义字符等价字符引用
<&lt;
>&gt;
"&quot;
'&apos;
&&amp;

HTML注释

如同大部分的编程语言一样,在HTML中有一种可用的机制来在代码中书写注释 —— 注释是被浏览器忽略的,而且是对用户不可见的,它们的目的是允许你描述你的代码是如何工作的和不同部分的代码做了什么等等。

为了将一段HTML中的内容置为注释,你需要将其用特殊的记号<!--和-->包括起来, 比如:

<p>我在注释外!</p>

<!-- <p>我在注释内!</p> -->

webxiang
9 声望1 粉丝

web前端开发者一枚,让我们一起成长,见证进步~