html常用标签与扩展(标签语义化、Doctype)

html常用标签

1、文档类性的声明

<!DOCTYPE html>声明该文档是一个html5的文档

xhtml是html以前版本的声明

注意:一些老网站可能用的还是老版本的文档类型比如XHTML之类的,但是我们学的是
HTML5,而且HTML5的文档类型兼容很好(向下兼容的原则),所以大家放心的使用HTML5
的文档类型就好了。

2、字符集

<metacharset="UTF-8"/>最常用 

了解:

BG2312简单中文包括6763个汉字
BIG5繁体中文港澳台等用
GBK包含全部中文字符是GB2312的扩展,加入对繁体字的支持,兼容GB2312
UTF-8则包含全世界所有国家需要用到的字符

3、常用的标签

   (1)、标题标签 :h1-h6  head

特点:1、文本自动加粗加大 

            2、文本的字体大小与h后边的的数字成反比

            3、自动换行

(2)、段落标签 paragraph    p paragraph

特点:自动换行

(3)、水平线标签   hr    horizon

      特点:显示一条横线  单标签

(4)、换行标签  br

特点:1、单标签 

              2、可以在文本内容中随处换行

(5)、盒子标签  div

特点:用div来进行网页布局 

  (6)、组合行内元素标签 span

特点:最典型的行内元素,2、不会换行 不设宽高,不独占一行,水平可以加内边距和外边距,可以和相邻的行内块元素,行内元素在同一行上,有默认宽高。

4、文本语义化标签

加粗 b  strong

斜体:i  em

下划线:u  ins

删除线:s  del

区别:strong/em/ ins/del跟具有语气话及强调

5、图片标签

图片标签     img

src属性:图片的路径

jpg/png/gif/psd 注意添加后缀名

再浏览器展示图片的大小就是默认大小

图片的宽

height:图片的高度

title:图片的标题 光标移动到图片上显示对应的属性值

alt:图片不显示时,显示alt的属性值 

相对路径:相对于当前位置

                    1、图片在当前文件夹下 ./ 或者不写

                    2、图片在当前文件的下一级目录

                    3、图片在当前文件的上一级目录../

绝对路径:路径是文件的整个目录

6、链接标签

(1)、anchor单词的缩写  锚及是a标签

href:跳转的路径 

跳转方式

跳转线上 

跳转本地

         #暂时不知道往哪儿跳转 

打开方式

          跳转链接后,默认在当前的窗口打开

         在新的窗口打开 target="_blank"

         在当前窗口打开 target="_self" 

(2)、锚点链接

给指定的内容添加id属性,其次在标题中添加链接标签,href的属性值用#与id名对应即可实现锚点定位

(3)、Base

base标签的target属性设置整个网页中所有a链接的跳转方式 

7、列表标签

(1)、分类:无序列表(ul li)、有序列表(ol li)、自定义列表 (dl dt dd)

(2)、无序:特点:1、独占一行

                                     2、没有顺序

                                      3、每一行前有个小点

(3)、有序: 特点:1、独占一行

                           有顺序

                           每一行前有顺序数字

扩展:

1、标签语义化的理解?

a. 去掉或者丢失样式的时候能够让页面呈现出清晰的结构

b. 有利于SEO:和搜索引擎建立良好沟通,有助于爬虫抓取更多的有效信息:爬虫依赖于标签来确定上下文和各个关键字的权重;

c. 方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备)以意义的方式来渲染网页;

d. 便于团队开发和维护,语义化更具可读性,遵循W3C标准的团队都遵循这个标准,可以减少差异化。

2、Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?

声明位于文档中的最前面,处于 标签之前。告知浏览器以何种模式来渲染文档。

严格模式的排版和 JS 运作模式是,以该浏览器支持的最高标准运行。

在混杂模式中,页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。

DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。

3、 各Doctype文档类型?

标签可声明三种 DTD 类型,分别表示严格版本、过渡版本以及基于框架的 HTML 文档。

HTML 4.01 规定了三种文档类型:Strict、Transitional 以及 Frameset。

XHTML 1.0 规定了三种 XML 文档类型:Strict、Transitional 以及 Frameset。

Standards (标准)模式(也就是严格呈现模式)用于呈现遵循最新标准的网页,

Quirks(包容)模式(也就是松散呈现模式或者兼容模式)用于呈现为传统浏览器而设计的网页。

原文地址:https://www.cnblogs.com/wenaq/p/13509298.html