语义化概论

一．语义化概述

1什么是语义化

HTML中不同的元素代表不同的含义

使用具有含义的元素来书写HTML文档，即语义化

书写HTML文档最重要的，即为不同的内容选择合适的元素

语义化属于HTML范畴，与样式无关     

目前，HTML的最新版本是HTML5，引入了更多的语义化元素

 

2.语义化的作用

有利于浏览器理解HTML文档

 

重要的内容，浏览器在阅读模式下不应该忽略该内容

若浏览器有语音阅读功能，应该重读该元素中的内容

有利于浏览器理解HTML文档

 

若浏览器有语音阅读功能，应该用一种特别的语调来阅读该元素的内容

有利于浏览器理解HTML文档

有利于搜索引擎理解HTML文档

3.HTML5元素表

 

三．超链接

 

 

绝对路径和相对路径

绝对路径

当网站部署到服务器后，网站中的所有资源都可以通过一个地址(路径)访问

该地址(路径)的书写格式为：

绝对路径

 

协议：http

域名：www.google.com

目录：根目录

绝对路径的使用场景：

访问站外资源时，只能使用绝对路径

访问站内资源时，若网站已部署到服务器，可以使用绝对路径，

   并可以省略协议和域名

绝对路径-示例

假设我的网站已部署到服务器，协议为http，域名为html.com

 

 

 

 

 

相对路径

相对路径是相对于当前资源的位置，只能用于访问站内资源

相对路径的书写格式为:./路径

./ 表示当前资源所在的目录，必须作为相对路径的开始，可省略

./ 表示返回上一级目录

相对路径-示例

 

 

 

 

综合示例

 

 

四．文本元素

H1~h61级标题~6级标题        p   段落

Block quote  整段的引用        cite 对参考文献的引用

Q  小段文本的引用             abbr 对缩写词的引用

Strong 重要的文本              em  强调的文本

B应突出显示的文本                    I  应区别对待的文本

五．结构元素

Div元素

它是一个非常常见的元素

它没有任何的语义

它仅仅表示一个容器，用于包含其他元素

在网站布局时，它通常用于表示页面的区域

       语义化结构元素

 

六．无语义元素

<Div>无语义，表示页面中的一块区域

<Span>无语义，仅用于给一个小短文本添加样式

<br>无语义，空元素，用于在页面中换行（少见）

<hr>无语义，空元素，用于在页面中制造一个分割线 （少见）

<pre>无语义，预格式化元素

七．实体字符

实体字符的书写格式为&实体名称；或&实体编号；

显示结果	描述	实体名称	实体编号
	空格	&nbsp；	&#160；
<	小于符号	&lt；	&#60；
>	大于符号	&gt；	&#62；
&	并且符号	&amp；	&#38；
©	版权符号	&copy；	&#169；

 

八．其他元素

<del>定义文档中已被删除的文本

<ins>定义已经被插入文档中的文本

<img>引用图片

<S>加删除线文本定义，是<strike>标签的缩写版本，使用<del>替代他

<ol>定义有序列表

       相关属性：

              Reversed：规定列表顺序为降序（9，8，7，。。。。。。）

              start：number 规定有序列表的起始值。

type：规定在列表中使用的标记类型(1，A，a，I，i)

 

<ul>定义无序列表

       相关属性：

              list-style：none; 消除原点

<li>定义列表项目

<dl>定义了定义列表

<dt>定义列表中的项目

<dd>描述列表中的项目

转载于:https://www.cnblogs.com/wcsliuzhixin/p/11525743.html