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>

  • 3
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Catherinemin

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值