这是我参与「第四届青训营 」笔记创作活动的第二天

HTML基础知识总结(二)

接上篇文章，本 章 着 重 复 习 Html 的 基 础 内 容 ， 学 习 HTML文本格式化标签。 主 要 是 学 习 各 种 标 签 ， 来 搭 建 网 页 的 “ 结 构 ” 。

一、HTML文本格式化标签

1.加粗：strong 和 b

    这是一个<strong>加粗</strong>的字体
    这是一个<b>加粗</b>的字体

2.倾斜：em 和 i

    这是一个<em>倾斜</em>的字体
    <i>倾斜问题2</i>

3.删除线：del 和 s

    我是<del>删除线</del>
    我是<s>删除线</s>

4.下滑线：ins 和 u

    我是<ins>下划线</ins>
    我是<u>下划线</u>

二、结构化无意义标签

1.div: 没有语义，表示一个独立区块。

    <div>我是div标签第一行，一个占据一行。类似java中的Box横向布局</div>
    <div>我是div标签第二行，一个占据一行。</div>

2.span: 行内元素。

   <span>我是一个span标签，可以一行放置多个span</span>

三、列表

1.ul无序列表

无序列表始于 <ul> 标签。每个列表项始于 <li>。

    <ul>
        <li>胡歌</li>
        <li>邓紫棋</li>
        <li>薛之谦</li>
        <!--容器里面，可以加任何元素：图片。。。-->
        <li>胡歌的照片<img src="胡歌.png"></li>
    </ul>

列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。

2.ol 有序列表

有序列表也是一列项目，列表项目使用数字进行标记。

有序列表始于 <ol> 标签。每个列表项始于 <li> 标签。

    <ol>
        <li>胡歌</li>
        <li>薛之谦</li>
        <li>邓紫棋</li>
        <!--容器里面，可以加任何元素：图片。。。-->
        <li>胡歌的照片<img src="胡歌.png"></li>
    </ol>

列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。

3.自定义列表(重点)

自定义列表不仅仅是一列项目，而是项目及其注释的组合。

自定义列表以<dl>标签开始。每个自定义列表项以<dt>开始。每个自定义列表项的定义以<dd>开始。

<dl>
        <dt>关注我们</dt>
        <dd>新浪微博</dd>
        <dd>官方微信</dd>
        <dd>联系我们</dd>
        
        <dt>关注我们</dt>
        <dd>新浪微博</dd>
        <dd>官方微信</dd>
        <dd>联系我们</dd>
    </dl>

效果展示：

四、超链接

1.HTML 超链接作用：

HTML 使用超级链接与网络上的另一个文档相连。

2. 锚标签和 Href 属性

(1)HTML 使用（锚）标签来创建连接另一个文档的链接。

<a> 用来创建锚。<a>可以指向任何元素，它是一个行内元素可以嵌套除他自身以外块的元素。例如：一张 HTML 页面，一幅图像，一个声音或视频文件等等。

<a href="url">字节跳动</a>

(2) href 属性用于定位需要链接的文档。

锚的开始标签和结束标签之间的文字被作为超级链接来显示。

其中 url可以是：任何网站的网址 ，或者是 #。

空链接展示：

<a href="#">空链接</a>

3. Target 属性

Target 属性，用来定义被链接的文档在何处显示。

(1) target="_self" :外部链接,默认当前窗口打开

<a href="http://www.qq.com" target="_self">腾讯</a>

(2) target="_blank" :外部链接,默认新打开一个窗口

<a href="http://www.qq.com" target="_blank">腾讯</a>

4. 内部链接

不再指向"外部网址"，而是 本地内的 文件。

href="公司简介.html"

<a href="公司简介.html" target="_blank">公司简介</a>

5. 下载链接

下载链接： 地址链接的是：文件 .exe或者.zip的形式

 <a href="1.zip">下载链接</a>