02.html 标签的学习

html标签

通过 <h1>、<h2>、<h3>、<h4>、<h5>、<h6>,标签可以在网页上定义6种级别的标题。6种级别的标题表示文档的6级目录层级关系，比如说： <h1>用作主标题，其后是 <h2>，再其次是 <h3>，以此类推。搜索引擎会使用标题将网页的结构和内容编制索引，所以网页上使用标题是很重要的。

<h1>这是一级标题</h1> <h2>这是二级标题</h2> <h3>这是三级标题</h3>

段落标签---------> <p>    　　段落标签定义一个文本段落，一个段落含有默认的上下间距，段落之间会用这种默认间距隔开；>>>>>>注意不要相互嵌套，否则样式进不去

换行标签 --------> <br/>  　　强制换行

字符实体：大于  &gt；，小于 &lt; 空格标签 --------> &nbsp

3 &lt; 5 10 &gt; 5 ------>  3<5 , 10 > 5

html块标签

1、<div> 标签 块元素，表示一块内容，没有具体的语义。
2、<span> 标签 行内元素，表示一行中的一小段内容，没有具体的语义

含样式和语义的标签

1、<em> 标签 行内元素，表示语气中的强调词
2、<i> 标签 行内元素，表示专业词汇                     >>>>>>>>> <em>, <i>   标签可以字体变斜体
3、<b> 标签 行内元素，表示文档中的关键字或者产品名 
4、<strong> 标签 行内元素，表示非常重要的内容   >>>>>>>>>  注释内容重要 加粗字体

 不要纠结怎么用 

语义化的标签

语义化的标签，就是在布局的时候多使用有语义的标签，搜索引擎在爬网的时候能认识这些标签，理解文档的结构，方便网站的收录。比如：h1标签是表示标题，p标签是表示段落，ul、li标签是表示列表，a标签表示链接，dl、dt、dd表示定义列表等，语义化的标签不多。

html图像标签

<img>标签可以在网页上插入一张图片，它是独立使用的标签，它的常用属性有：

  • src属性 定义图片的引用地址   >>>>>>>>>

    • “ ./ ” 表示当前文件所在目录下，比如：“./pic.jpg” 表示当前目录下的pic.jpg的图片，这个使用时可以省略。

    • “ ../ ” 表示当前文件所在目录下的上一级目录，比如：“../images/pic.jpg” 表示当前目录下的上一级目录下的images文件夹中的pic.jpg的图片。

  • alt属性 定义图片加载失败时显示的文字，搜索引擎会使用这个文字收录图片、盲人读屏软件会读取这个文字让盲人识别图片，所以此属性非常重要。

<img src="images/pic.jpg" alt="图片" />  

html链接标签

<a>标签可以在网页上定义一个链接地址，它的常用属性有：

  • href属性 定义跳转的地址

  • title属性 定义鼠标悬停时弹出的提示文字框

  • target属性 定义链接窗口打开的位置

    • target="_self" 缺省值，新页面替换原来的页面，在原来位置打开
    • target="_blank" 新页面会在新开的一个浏览器窗口打开

 

<a href="#"></a> <!-- # 表示链接到页面顶部 -->

<a href="http://www.baidu.com/" title="跳转的网站">baidu</a>

<a href="2.html" target="_blank">测试页面2</a>

列表标签：

在网页上定义一个有编号的内容列表可以用<ol>、<li>配合使用来实现

在网页上定义一个无编号的内容列表可以用<ul>、<li>配合使用来实现

定义列表通常用于术语的定义。<dl>标签表示列表的整体。<dt>标签定义术语的题目。<dd>标签是术语的解释。一个<dl>中可以有多个题目和解释

<h1>有序表单</h1>
<!-- ol>(li)*3 -->
<ol>
<li>h5</li>
<li>css</li>
<li>javascript</li>
</ol>

<h1>无序列表</h1>
<!-- ul>(li>a{新闻标题})*3 -->
<ul>
<li><a href="#">新闻标题1</a></li>
<li><a href="#">新闻标题2</a></li>
<li><a href="#">新闻标题3</a></li>
</ul>

<h1>定义列表</h1>
<!-- dl>(dt+dd)*3 -->
<dl>
<dt>html</dt>
<dd>负责页面结构</dd>
<dt>css</dt>
<dd>负责页面表现</dd>
<dt>JavaScript</dt>
<dd>负责页面行为</dd>
</dl>
 
posted @ 2020-10-08 16:04  大王叫我来巡山辶  阅读(95)  评论(0)    收藏  举报