1、css边框：
text-align: center; 水平方向居中
line-height: 48px;跟标签高度一样，为竖直方向居中
font-weight: bold;字体加粗
<body>
<div style="border:1px dotted red">
1234
</div>
<div style="height:50px;
width:80%;
border:1px solid red;
font-size:16px;
text-align:center;
line-height:50px;
font-weight:bold;
">5678
</div>
</body>
2、float样式
float：让标签飘在空中，可以使块级标签堆叠
<body>
<div style="width:20%;background-color:red;float:left">1</div>
<div style="width:20%;background-color:black;float:right">2</div>
</body>
执行结果如下：
如果这两个div的width超过了100%，则不会在一行中堆叠，执行结果如下：
3、display样式
display: none; 让标签消失，默认看不见标签 display: inline;可以使块级标签有行内标签的特性 display: block;可以使行内标签有块级标签的特性 display: inline-block; inline,默认自己有多少占多少 block，可以设置无法设置高度，宽度，padding（内边距） margin（外边距）
示例如下：
div为块级标签；span为行内标签
span无法设置高度、宽度等，但使用display属性后，便可以了
<body>
<div style="background-color: red;display: inline;">1234</div>
<span style="background-color: red;display: block;">5678</span>
<span style="display:inline-block;background-color: red;height: 50px;width: 70px;">WUWU</span>
<a style="background-color: red;">Eric</a>
</body>
执行结果如下：
原文：https://www.cnblogs.com/wuxiaoru/p/12334932.html