HTML行块属性

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="utf-8">
 5     <meta name="viewport" content="width=device-width, initial-scale=1">
 6     <title></title>
 7     <style type="text/css">
 8         div{
 9             width: 300px;
10             height: 300px;
11             background: lightblue;
12             display: inline-block;
13         }
14         span{
15             width: 300px;
16             height: 300px;
17             background: lightgreen;
18             display: inline-block;
19         }
20         input{
21             width: 300px;
22             height: 30px;
23         }
24     </style>
25 </head>
26 <body>
27     <div>我是div</div>
28     <div>我是div</div>
29     <span>我是span</span>
30     <span>我是span</span>
31     <input type="" name="">
32     <input type="" name="">
33 </body>
34 </html>

块属性:div,p,ul,ol,li,h1-h6等
特点:1.可以设置宽高
2.不可以与别人共处一行
3.不设置宽度的情况下,宽度为100%
行内属性:span,a,em,strong,br
特点:1.不可以设置宽高
2.可以与别人共处一行
3.其宽高由内容撑开
行内块属性:img,input
特点:1.可以设置宽高
2.可以与别人共处一行

posted @ 2021-11-07 23:11  仙女会长高  阅读(86)  评论(0)    收藏  举报