微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

html5 分组元素

效果

代码

<!DOCTYPE html>
<html lang="zh-cn">
<head>
   <Meta charset="utf-8">
   <title>分组元素</title>
<head>
<body>
   <p>这是一个段落</p>///换行
   <p>这是另一个段落</p>

   <div>这是一个段落</div>//比p行间距小,与br间距相同,但是可以设置
   <div>这是一个段落</div>
   <blockquote>这是一个段落</blockquote>///blockquote和p一样具有换行,特点是包含了首尾缩进
   <hr>///添加分行线
   <blockquote>这是另一个段落</blockquote>
   ###
      ###
        ###
      ###
   ###
   <pre>///pre按照排版样式原封不动的展现出来
   ###
      ###
        ###
      ###
   ###
   </pre>

   <ul>///<ul><li>添加无序列表
       <li>张三</li>
       <li>李四</li>
       <li>王五</li>
   </ul>
   <ol>///<ol><li>添加有序列表
       <li>张三</li>
       <li>李四</li>
       <li>王五</li>
   </ol>
   <ol start="5">
       <li>张三</li>
       <li>李四</li>
       <li>王五</li>
   </ol>
   <ol type="a">
       <li>张三</li>
       <li>李四</li>
       <li>王五</li>
   </ol>
   <ol type="a">
       <li>张三</li>
       <li value="5">李四</li>
       <li>王五</li>
   </ol>
   <dl>
      <dt>这是第一份文件</dt>
      <dd>这是第一份文件的详细内容1</dd>
      <dd>这是第一份文件的详细内容2</dd>
      <dt>这是第二份文件</dt>
      <dd>这是第二份文件的详细内容1</dd>
      <dd>这是第二份文件的详细内容2</dd>
   </dl>
   <figsure>
       <figcaption>这是一张图片</figcaption>
       <img src="img.png">
   </figsure>
</body>
<html>

ppt:

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。