码迷,mamicode.com
首页 > Web开发 > 详细

HTML块级标签汇总(小篇)

时间:2016-07-13 21:04:01      阅读:245      评论:0      收藏:0      [点我收藏+]

标签:

块级元素,简单来说,就是自己独占一行的元素。其特点:

  ①总是在新行上开始;
  ②高度,行高以及外边距和内边距都可控制;
  ③宽度缺省是它的容器的100%,除非设定一个宽度。
  ④它可以容纳内联元素和其他块元素
汇总代码如下:
 1 <!doctype html>
 2 <html>
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     <!-- 块状元素 独占一行 -->
 9 
10     <!-- div无语义,称它为盒子 -->
11     <div>盒子</div>
12     
13     <!-- h1-h6语义 定义标题 -->
14     <h1>标题1</h1>
15     <h2>标题2</h2>
16     <h6>标题3</h6>
17     
18     <!-- p 语义 段落标签 写文字-->
19     <p>文章</p>
20     
21     <!-- 列表多数用来存一系列的相似的数据 -->
22     <!-- 有序列表 -->
23     <ol>
24         <li>导航1</li>
25         <li>导航2</li>
26         <li>导航3</li>
27     </ol>
28     <!-- 无序列表 -->
29     <ul>
30         <li>导航1</li>
31         <li>导航2</li>
32         <li>导航3</li>
33     </ul>
34     <!-- 定义列表 解释某个名词 -->
35     <dl>
36         <dt>名词</dt>
37         <dd>解释名词的位置</dd>
38     </dl>
39 
40     <!-- 表格 渲染性能不好 少用 -->
41     <table>
42         <caption>表格头部</caption>
43         <!-- tr是行 -->
44         <tr>
45             <!-- th表头 -->
46             <th>星期一</th>
47             <th>星期二</th>
48         </tr>
49         <tr>
50             <!-- td单元格 -->
51             <td>上课</td>
52             <td>上课</td>
53         </tr>
54     </table>
55 </body>
56 </html>

 

HTML块级标签汇总(小篇)

标签:

原文地址:http://www.cnblogs.com/huangzongyi/p/5667424.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!