一、基本结构
html文件的基本结构由html元素及其包裹的head元素,body元素组成。
元素 = 标签+ 内容(可以是文本 也可以是另一个元素)
head元素:主要用来携带一些信息给浏览器
body元素:告诉浏览器你所想要在浏览器上显示的内容
二、HTML标签
语法:<标签名 属性名1=”值” 属性名2=”值”> <标签名/>
例如:<body bgcolor=”pink”></body>
规范:
使用尖括号括起来
一般成对出现,分开始标签<>和结束标签</>。
单标签,没有结束标签 <hr/>
三、 HTML注释
注释标签:<!—内容-->
<!--注释的内容在网页中是不会显示的-->
四、 文档申明
DOCTYPE,或者称为 Document Type Declaration(文档类型声明,缩写 DTD).
通常情况下,DOCTYPE 位于一个 HTML 文档的最前面的位置,位于根元素 HTML 的起始标签之前。因为浏览器必须在解析 HTML 文档正文之前就确定当前文档的类型,以决定其需要采用的渲染模式,不同的渲染模式会影响到浏览器对于 CSS 代码甚至 JavaScript 脚本的解析。
HTML5 对应的文档申明: <!DOCTYPE html>
五、中文乱码问题
<meta charset="UTF-8">
charset属性告诉浏览器你应该以那种方式来解码html文件
只有当文件本身的编码与告知浏览器的解码方式达成一致时,才不会出现中文乱码
六、 常用实体字符
实体字符 | 字符 | 描述 |
| < | 小于号 |
| > | 大于号 |
| ® | 已注册 |
| © | 版权 |
| ™ | 商标 |
| Space | 不断行的空格 |
代码示例:
<!--
文档声明,通常放在文档的底部
<!DOCTYPE html> h5的文档声明,声明当前的网页是按照HTML5标准编写的,
如果缺失,在某些浏览器下会造成渲染异常,浏览器解析页面会导致页面无法正常显示。
-->
<!DOCTYPE html>
<!--
html根标签,一个页面中有且只有一个根标签,网页中的所有内容都应该写在html根标签中
-->
<html>
<!--
head元素:主要用来携带一些信息给浏览器
-->
<head>
<!--
meta标签用来设置网页的一些元数据,比如网页的字符集,关键字、简介
meta是一个自结束标签,编写一个自结束标签时,可以在开始标签中添加 一个/
(面试点)charset属性告诉浏览器你应该以那种方式来解码html文件,只有当文件本身的编码与告知浏览器的解码方式达成一致时,才不会出现中文乱码
-->
<meta charset="UTF-8">
<!--
使用meta标签还可以用来设置网页的关键字
-->
<!--<meta name="keywords" content="HTML5,JavaScript,前端,Java" />-->
<!--
还可以用来指定网页的描述
搜索引擎在检索页面时,会同时检索页面中的关键词和描述,但是这两个值不会影响页面在搜索引擎中的排名
-->
<!--<meta name="description" content="发布h5、js等前端相关的信息" />-->
<!--
使用meta可以用来做请求的重定向
<meta http-equiv="refresh" content="秒数;url=目标路径" />
-->
<!--<meta http-equiv="refresh" content="5;url=http://www.baidu.com" />-->
<!--
title网页的标题标签,默认会显示在浏览器的标题栏中
搜索引擎在检索页面时,会首先检索title标签中的内容
它是网页中对于搜索引擎来说最重要的内容,会影响到网页在搜索引擎中的排名
-->
<title></title>
</head>
<!--
body元素:告诉浏览器你所想要在浏览器上显示的内容
body标签用来设置网页的主体内容,网页中所有可见的内容,都应该在body中编写
-->
<body>
</body>
<!--
其余详情参看文档说明
-->
</html>