html5 分组元素

最新推荐文章于 2024-09-11 20:59:43 发布

fxy流年无悔

最新推荐文章于 2024-09-11 20:59:43 发布

阅读量1k

点赞数

分类专栏： web 文章标签： html5

本文链接：https://blog.csdn.net/a716121/article/details/52091889

版权

web 专栏收录该内容

41 篇文章 0 订阅

订阅专栏

效果：

代码：

<!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: