块级元素

[2019.07.04 学习笔记1]

1.块级元素（block element）独占一行，排斥与其他元素同行。

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>块级元素</title>
 6 </head>
 7 <body>
 8     <p>段落</p>
 9     <p>段落</p>
10     <p>段落</p>
11     <p>段落</p>
12 </body>
13 </html>
块级元素

2.块级元素一般是其他元素的容器，可容纳块级元素和行内元素。

3.默认情况下宽度与浏览器宽度一样，与内容无关

    可设置元素宽（width）和高（height），四个方向的内边距（padding）和外边距（margin）。

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>块级元素</title>
 6 </head>
 7 <body>
 8     <p style="width:200px; height: 200px; padding: 10px; margin: 10px;">段落</p>
 9     <p>段落</p>
10     <p>段落</p>
11     <p>段落</p>
12 </body>
13 </html>
块级元素-设置属性

4.CSS样式默认显示为dispaly:block;，可将块级元素设置为行内元素。

5.块级元素有：address、div、dl、ol、ul、form、table、h1~h6、p、pre、hr、fieldset（控制组）

6.可设置位置属性align

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>块级元素</title>
 6 </head>
 7 <body>
 8     <p>段落</p>
 9     <p align="center">段落</p>
10 </body>
11 </html>
块级元素--位置属性

 

posted @ 2019-07-04 10:21  C_XingM  阅读(505)  评论(0)  编辑  收藏  举报