CSS块元素

古城微笑少年丶 2023-01-05 15:26 143阅读 0赞

#### 什么是css块元素？ ####

块级元素是独占一行显示的。它的兄弟元素必定不会与其在同一行中（除非脱离了文档流）。通俗点来说，就是块元素(block element)一般是其他元素的容器元素，能容纳其他块元素或内联元素。

#### css块元素的三个特点： ####

*  每个块级元素都是独自占一行，其后的元素也只能另起一行，并不能两个元素共用一行。
 *  元素的高度、宽度、行高和顶底边距都是可以设置的。
 *  元素的宽度如果不设置的话，默认为父元素的宽度。

#### 常见的块元素有哪些？ ####

<table> 
 <thead> 
  <tr> 
   <th>元素</th> 
   <th>作用</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>address</td> 
   <td>地址</td> 
  </tr> 
  <tr> 
   <td>blockquote</td> 
   <td>块引用</td> 
  </tr> 
  <tr> 
   <td>center</td> 
   <td>举中对齐块</td> 
  </tr> 
  <tr> 
   <td>dir</td> 
   <td>目录列表</td> 
  </tr> 
  <tr> 
   <td>div</td> 
   <td>常用块级容器，也是CSS layout的主要标签</td> 
  </tr> 
  <tr> 
   <td>dl</td> 
   <td>定义列表</td> 
  </tr> 
  <tr> 
   <td>fieldset</td> 
   <td>form控制组</td> 
  </tr> 
  <tr> 
   <td>form</td> 
   <td>交互表单</td> 
  </tr> 
  <tr> 
   <td>h1– h6</td> 
   <td>标题</td> 
  </tr> 
  <tr> 
   <td>hr</td> 
   <td>水平分隔线</td> 
  </tr> 
  <tr> 
   <td>menu</td> 
   <td>菜单列表</td> 
  </tr> 
  <tr> 
   <td>ol</td> 
   <td>有序表单</td> 
  </tr> 
  <tr> 
   <td>p</td> 
   <td>段落</td> 
  </tr> 
  <tr> 
   <td>pre</td> 
   <td>格式化文本</td> 
  </tr> 
  <tr> 
   <td>table</td> 
   <td>表格</td> 
  </tr> 
  <tr> 
   <td>ul</td> 
   <td>无序列表</td> 
  </tr> 
 </tbody> 
</table>