HTML|02 HTML标签

HTML标签的语义化

语义化就是：标签的含义

HTML标签

排版标签
    标题标签h
        <h1></h1> 标签有h1-h6，没有h7
    段落标签p
        <p></p>
    水平线标签hr
        <hr /> 单标记
    换行标签br
        <br />
    div span标签
        用来布局的
文本格式化标签
    <b></b><strong></strong>  加粗显示（XHTML推荐使用strong）
    <i></i><em></em>          斜体显示（XHTML推荐使用em）
    <s></s><del></del>        加删除线显示（XHTML推荐使用del）
    <u></u><ins></ins>        加下划线显示（XHTML不赞成使用u）
    b i s u标签没有强调的意思，strong em del ins 语义更强烈。
标签属性
    标签语法格式：
        `<标签名 属性1='属性值1' 属性2='属性值2'> 内容 </标签名>`                      
            1.标签可以拥有多个属性，必须卸载开始标签中，位于标签名后面。
            2.属性之间部分先后顺序，标签名与属性、属性与属性之间均以空格隔开。
            3.任何标签的属性都有默认值，省略该属性则取默认值。
图像标签img
    <img src='图片路径' 
         alt='图像不能显示时的替换文本'
         title='鼠标悬停时显示的内容'
         width='图像的宽度'
         height='图像的高度'
         border='图像边框的宽度'/>
链接标签a
    <a href='跳转目标' target='目标窗口的弹出方式'/>
        target默认是slef,blank为在新窗口中打开链接，
        比如<a href="http://www.baidu.com" target="_black">百度</a>
        
        注意：
            1.外部链接，需要添加http://，比如百度http://baidu.com
            2.内部链接，直接链接内部页面名称，比如<a href="04.常用标签-新闻练习.html">今日新闻</a>
            3.如果当时没有确定链接目标时，通常将链接herf属性设置为#（即<a href="#"></a>），表示该链接暂时为空连接
            4.不仅可以创建文本超链接，在网页中各种网页元素，如图像、表格、音频、视频等都可以添加超链接

    锚点定位
        通过创建锚点链接，用户能够快速定位到目标内容。
        创建锚点链接分为两步：
            1.使用<a href='#id名'> 创建文本链接
            2.使用相应的id名标注跳转目标的位置，比如：<h3 id="id名"></h3>

    base标签
        可以设置整体链接的打卡状态,比如：<base target="_blank" />
    
特殊字符标签
    &nbsp;  空格符
    &lt;    小于号<
    &gt;    大于号> 
    &amp;   和号&
    &yen;   人民币￥
    &copy;  版权©
    &reg;   注册商标®
    &deg;   摄氏度°
    &plusmn;    正负号±
    &times; 乘号×
    &divide;    除号÷
    &sup2;  平方（上标2）
    &sup3;  立方（上标3）

注释标签
    <!-- 注释 -->

   路径
        相对路径
            <img src="..\..\..\..\..\..\..\图片\爱豆\IMG_0143.JPG">
        绝对路径
            显示全部路径，比如<img src="E:\一念之间\图片\爱豆\IMG_0143.JPG">
    
    列表标签
        无序列表ul
            <ul>
                <li></li>
                <li></li>
                <li></li>
            </ul>
            注意：
                1. ul标签中只能放li标签
                2. li标签相当于一个容器，比如<li><p>西红柿</p></li>
                3. 无序列表会有自己的样式属性，让CSS处理。
    
        有序列表ol
            <ol>
                <li></li>
                <li></li>
                <li></li>
            </ol>
    
        自定义列表
            <dl>
                <dt>北京</dt>
                <dd>昌平</dd>
                <dd>通州</dd>
                <dd>顺义</dd>
                <dd>海淀</dd>
            </dl>