基本标签

基本标签

• 怎么写标签?

标签是由：小于号+中间字符+大于号组成的代码(注意:代码里所有字符都由英文字符组成)

标签的格式

• 单标签 (单身标签)

• 双标签(情侣标签)

  如果有/(斜杠)的为该标签的结束标签,没有的就为开始标签.

标签即元素,元素即标签.

注释标签

用法:代码的作用，含义，意图写在四个减号中间,内容不会被浏览器解析;

让别人更能明白这段代码你写的是什么内容,有什么作用

!DOCTYPE html 定义html5的文档类型

!表示着重声明,专业术语称为DTD,这是一条指令,告诉游览器所用的标记的版本;

卸载文档的第一行.告诉游览器这是HTML页面,不区分大小写,但是按照惯例,doctype大写.

这个声明是向前兼容的.

html会在老内容支持的前提下不断加入新内容,即使你用以前技术去做的网站,目前仍然能在html5的文档格式进行兼容达到正常的显示.

html 根标签

网页中的所有内容全部放在html标签内部;

网页根标签 lang是language的缩写，代表是该网页属于哪一个国家或是地区的网页;不能写多个.

如果是中文网站写中文,如果写英文,因为一些插件,会识别你这为英文网站并且提示你是否要翻译

head 头部标签

header是网页的头部标签,head里面的内容不会直接出现在网页中,

作用:

主要是帮助游览器和搜索引擎去解析网页.

title 标题标签

title中的内容会显示在游览器的标题栏,游览器会根据title判断网页的主要内容

方便用户通过搜索网页的名字找到相应的网站.

title标签的内容会作为搜索结果的超链接上的文字显示

网页的名字,当把文档加入用户的收藏夹或书签列表时，标题标签的内容将成为该文档链接的默认名称

**注意:**尽量把重要的关键词放在前面,关键词不要重复出现,尽量做到每个页面的title标题中不要设置相同的内容。

meta标签 单标签

meta标签被称为网页的元数据

元数据就是一些与生俱来的底层数据,类比于相当于人的DNA.

作用告诉游览器和搜索引擎基本数据

meta charset=“utf-8”

作用:网页文字的编码格式,避免乱码问题.

游览器不知道网页文件的编码集的话就会导致乱码

(计算机不认识中文,我们也可能不认识法语),写上utf-8就是支持中文的万国码.

通过声明一个明确的字符编码，让浏览器轻松、快速的确定适合网页内容的渲染方式，通常指定为’UTF-8’。

如果一个网页要显示很多国家的语言就开发出了utf-8,在开发中我们使用的字符集都是utf-8.

meta name=“keywords” content=“关键字信息”

name属性指定网页的数据名称

content属性指定数据的内容

表示网页的关键字信息

可以同时指定多个关键字没有限制,关键字之间用,隔开

例如: 京东网站 content写网上购物,网上商城,家电,家居,母婴,图书,可以根据这些关键字找到网站

meta name=“description” content=“网页的描述信息”

描述信息被搜索引擎采用后,作为页面的摘要去显示

网站的描述会显示在搜索引擎的搜索结果中

body存放用户看到的所有内容

body是html的子元素,表现网页的主题部分.所有可见部分都应该放在body里面

可以存放包含文字,图片,视频,音频.整个网页就这四类资源

视频目前最占带宽流量的流媒体服务

div(DIVision) 划分区域标签

Div标签本身没有什么特别之处,没有语义，没有权重,

div标签最大功劳的是替代了以前table标签布局,

正因为没有语义我们可以利用idv在网页内容中划分出多个矩形区域,存放不一样的内容.

一个个div就像一个个集装箱,我们去用这些集装箱去各式各样的物品,也就是我们去装我们的标签,来达到页面的位置布局.

目前来说div还是我们主要的布局元素

h标签正文中的标题

H标签的重要性仅次于页面Title,文章会有标题,如首页的logo上可以加H1标签,包含最重要的关键词.

h1标签自带的权重使得网页的蜘蛛爬虫认为它最重要.

一个页面最多一个h1标签,就像你生命中最重要的女人一个.

更小的标题可以使用h3标签,没有明确的个数限制,但是要和h2有一定的比例关系,一个h2对应三个h3.就像一个公司最上面一个总裁,两三个副总裁,后面还有各个部门和职员一样.

h分出的区域和div分出的区域用户看起来没有任何区别,

标签写的更加符合规范时是给搜索引擎看的,搜索引擎只会收录一些比较重要的标签

div京东和h1京东,h1写的京东肯定会被收录

大量使用H标签反而会适得其反,使得主题不能突出,搜索引擎爬虫就不能正确的爬出你想要它爬出的内容.最终网站排名反而不好.

ul（ Unordered List) li (list-item) 无序列表标签

内容相似、结构相仿、布局接近使用无序列表.

使用li表示列表项

ul 标签子层级里只能写li标签.

如果你想添加p,div等标签,你在li里面添加一万个都没关系.

用ul标签划分出很多相同大区域,li划分大区域里面单个相似的区域.

布局之前先做结构也是去用好标签,标签使用正确网络布局才可能正确.

属性:type

1. 无序列表的符号,不建议去使用,但凡是样式的表现效果请使用css去实现.
2. 值:默认disc：实体圆、circle：空心圆、square：实体方块
3. 仅做了解

<!-- 无序列表默认属性type的值是disc，disc定义一个实体圆，所以disc不用刻意去设置 -->
        <ul>
            <li>我是第一个</li>
            <li>我是第二个</li