• 一些基本html标签的使用案例


    <!--按!+tab或html:5+tab会自动生成文档结构-->
    <!doctype html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <!--移动端开发设置-->
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
    </head>
    <body>
        <!--1.div:用来布局的,没有具体含义。层-->
        <div>
            abc
            <div>dbe</div>
        </div>
    
        <!--2.hx:标题,从1级到6级,1级标题最大,6级最小,会自动加粗,有默认字号-->
        <h1>前端课程内容</h1>
        <h2>Java开发</h2>
        <h6>大前端开发</h6>
    
        <!--3.p:表示段落。相当于一个回车。-->
    
        <p>根据国家卫健委最新数据显示,全国除湖北以外地区每日新增的新冠肺炎确诊病例,
            已连续多天呈下降态势,经过艰苦努力,疫情形势出现积极变化,防控工作取得积极成效。然而,
            爬坡过坎之际,还远未到喘口气、歇一歇的时候。我们必须坚持底线思维,把困难想得再充分些,
            把形势估计得再严峻些,把措施定得再周密些,坚决打赢疫情防控阻击战。</p>
    
        <p>根据国家卫健委最新数据显示,全国除湖北以外地区每日新增的新冠肺炎确诊病例,</p>
        已连续多天呈下降态势,经过艰苦努力,疫情形势出现积极变化,防控工作取得积极成效。
        然而,爬坡过坎之际,还远未到喘口气、歇一歇的时候。我们必须坚持底线思维,
        把困难想得再充分些,把形势估计得再严峻些,把措施定得再周密些,
        坚决打赢疫情防控阻击战。
    
        <!-- 4.br:生成一个换行符。单标签-->
        <p>根据国家卫健委最新数据显示,全国除湖北以外地区每日新增的新冠肺炎确诊病例,<br />
            已连续多天呈下降态势,经过艰苦努力,疫情形势出现积极变化,防控工作取得积极成效。然而,<br />
            爬坡过坎之际,还远未到喘口气、歇一歇的时候。我们必须坚持底线思维,把困难想得再充分些,<br />
            把形势估计得再严峻些,把措施定得再周密些,坚决打赢疫情防控阻击战。</p>
        <!--5.hr:生成一条水平线,主要起装饰作用。单标签-->
        <hr />
        <hr width="80%" align="center" color="red" height="2px" />
    
        <!--6.a:实现链接跳转。target:_blank/_self/_parent/_top-->
        <a href="http://baidu.com" title="百度">百度</a>
        <a href="01 HTML文档结构.html" target="_blank">文档结构</a>
        <a href="01 HTML文档结构.html" target="_self">文档结构</a>
    
        <!--7.img:用来加载外部图片、图像。src:用来设定加载的图片或图像的路径,alt:当图像加载不成功时,将显示其内容,否则将不会显示。-->
        <img src="https://img.alicdn.com/imgextra/i4/785200401/TB2BB3HbeuSBuNjSsplXXbe8pXa_!!785200401-0-beehive-scenes.jpg_250x250xz.jpg" title="test" alt="商品" />
        <img src="http://imgs.alicdn.com/imgextra/i4/785200401/TB2BB3HbeuSBuNjSsplXXbe8pXa_!!785200401-0-beehive-scenes.jpg_250x250xz.jpg" alt="商品" />
    
        <!-- 8.span:作用与div一样,都是用来布局的,不同的是div会单独占一行,而span不会;span用于行内布局。-->
        <div>div1</div>
        <div>div2</div>
    
        <span>span1</span>
        <span>span2</span>
    
        <!--9.ul/ol:列表,前者是无序列表,后者是有序列表,它们的列表内容都用的是li标签。-->
        <ul>
            <li>li1</li>
            <li>li2</li>
            <li>li3</li>
        </ul>
        <!--复制的快捷键:Ctrl+D-->
        <ol>
            <li>li1</li>
            <li>li2</li>
            <li>li3</li>
        </ol>
        <!--注释的快捷键:Ctrl+Shift+/-->
        <!-- 注意:浏览器不会解析注释内容的 -->
        <!--
           ejfds
           dfdfd
    
           -->
        <br><br><br><br><br>
    </body>
    </html>
    

      本案例来自于网络。

  • 相关阅读:
    this 指向 及 调用方式
    页面布局上 左 右底部
    Thread Safety线程安全
    sql查删更
    LinuxMysql命令操作数据库
    excel链接sharepoint 用于 Excel 的 Microsoft Power Query
    W7无法更新
    发票点数计算
    sharepoint OWA问题解决
    zend studio 做前端推荐安装的插件
  • 原文地址:https://www.cnblogs.com/YM99/p/13676184.html
Copyright © 2020-2023  润新知