HTML5标签的总结

<p>段落标签</p> ：用来定义网页中的一段文本  使文本内容在网页上呈现出来

如图效果：<p>今年的汽车市场一直比较“魔幻”，新能源市场的角逐，燃油车与纯电车型的竞争，合资与自主的较量，价格战的持续性，都在预示着，汽车市场再次优胜劣汰的时刻到来了。</p>

加粗 strong语意化标签提高seo效率，为了加粗而加粗用b 主要的用strong 不重要用b 使内容达到一个加粗的效果

       <strong>内容</strong>

        <b>内容</b> 

下划线 重要的用ins 不重要的的用u 为文字添加一个下划线的效果

         <u>内容</u>

        <ins>内容</ins> 

斜体 重要的用em 不重要的的用i

        <em>斜体</em>

        <i>斜体</i> 

   删除线  重要的用del 不重要的用s 提倡用del标签来表示 在内容上添加一个删除线的效果

        <s>删除线</s>

        <del>删除线</del> 

 a标签跳转页面点 title属性 title是一个提示性文本  配合提示文本使用效果更好

       <a href="网页的链接">跳转(根据所需内容来)</a> 

点击跳转就会跳转到你所输入的链接页面

 图片标签img是一个单标签 在页面里显示图片 （图片根据自己所需来设置）以下图片为演示效果

        <img src="直接查找图片名称即可=""> 

 查找其他目录

width height 宽和高 两个属性同时设置的话可能会使图片变形 只设计一个属性的另外一个属性会等比转换 值可以是px(像素)也可以是百分比 一般系统默认为px(像素)根据自己所需大小来设置  title在图片标签中也是一个提示文本的作用将鼠标放置在图片是即可出现文本效果 如图所示：

  title提示文本 

        <img src="图片 alt="" title="我是个图片">

        <div>

            <img src="所存图片的位置" alt="" title="我是个图片" width="30%">

            <img src="所存图片的位置" alt="" title="我是个图片" width="500px">

        </div> 

 

        alt替换文本 图片正常显示alt没有 图片加载不出来，显示alt内容

        <img src="图片" alt="替换"> 

HTML代码中输入多个空格 换行 缩进 最终只会解析出一个空格 字符实体可以在网页里代替一些特殊符号

   空格 &nbsp 小于号<&lt  <大于号 &gt  圆点 &middot

布局标签<div></div>种类 无序列表 有序列表 自定义列表 ul 无序列表 数据项前面有一个小圆点 没有顺序之分的列表如新闻列表ul表示无序列表的整体，把所有的li标签包裹起来 ul里面只能放li li 用来展示列表里的每一条数据 可以放任意内容

 <div>

    <ul>

        <li>内容</li>

        <li>内容</li>

        <li>内容</li>

        <li>内容</li>

        <li>内容</li>

    </ul>

    </div>

ol有序列表 用来包裹li列表 前面不会出现圆点而是会展示序号

  

<div>

    <ol>

        <li>小明</li>

        <li>小李</li>

        <li>小红</li>

        <li>小王</li>

    </ol>

 

自定义列表是一个带标题的列表 dl用来包裹整个自定义列表 dt用来展示自定义列表的标题 dd用来展示自定义列表里的每一条数据 dd前会默认显示缩进的效果 

    <div>

    <dl>

        <!-- 第一项 -->

        <dt>Firefox</dt>

        <dd>火狐好用</dd>

        <!-- 第二项 -->

        <dt>Chrom</dt>

        <dd>谷歌好用</dd>

    </dl>

    </div>