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:


展开阅读全文

没有更多推荐了,返回首页