第二十七节内联块属性

 1 <!DOCTYPE html>
 2 <!--     3、内联块：也叫行内块，是新增的元素类型，现有的元素类型没有归于此类，img和input元素的行为类似这种元素，但是也归类于内联元素，我们可以用display属性将块元素或者内联元素转化成这种元素。他们在布局中表现的行为：
 3         a、支持全部样式
 4         b、如果没有设置宽高，宽高由内容决定
 5         c、盒子并行在一行
 6         d、代码换行，盒子产生间距
 7         e、子元素是内联块元素，父元素可以用text-align属性设置子元素的水平对其方式 -->
 8 <html lang="en">
 9 <head>
10     <meta charset="UTF-8">
11     <title>内联块实例</title>
12     <style type="text/css">
13         
14         .box{
15             width:600px;
16             height:600px;
17             border:1px solid #000;
18             font-size:0;
19         }
20         .box a{
21             width:60px;
22             height:60px;
23             background-color:red;
24             display: inline-block;  /* 设置为内联模块 */
25             font-size: 16px;
26 
27         }
28 
29     </style>
30 </head>
31 <body>
32     <div class="box">
33         <a href="#">链接一</a>
34         <a href="#">链接二</a>
35         <a href="#">链接三</a>
36         <a href="#">链接四</a>
37     </div>
38 </body>
39 </html>

来源：https://www.cnblogs.com/kogmaw/p/12420685.html

标签

块元素

内联元素

易学教程内所有资源均来自网络或用户发布的内容，如有违反法律规定的内容欢迎反馈！
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!

第二十七节 内联块属性

第二十七节内联块属性