目录
一）inline：
1、类似于span标签，不会独占一行，元素排满外部容器之后就会自动换行。
2、不可以设置宽度和高度，设置均无效。
3、设置内外边距时，只有水平方向生效，垂直方向边距设置不生效。
4、两个inline属性的元素，只要该行未排满仍然不会换行。span默认就是inline布局，所以最终显示的是”我是我你是你“没有换行效果。
<span>我是我</span>
<span>你是你</span>二）block
1、类似于div标签，所以与inline最大的区别就是每个block布局的元素会独占一行。
2、block布局的元素可以设置高度和宽度。尽管两个block的宽度都是容器的50%还是会有换行效果。
3、block布局支持内外边距的所有设置。
4、block布局的宽度默认会将容器填满
三）inline-block
1、是inline和block的综合版。具有inline的不换行效果。
2、具有block的可以设置宽度高度的属性。
3、可以设置边距属性。
4、由于不换行性，就允许了再inline-block布局的左右添加元素，
例：在文字的左边添加小红点：
<!--HTML部分 -->
<view class="notify-content">您有{{ message }}条未读消息</view> /*css代码*/
.notify-content{
font-size: 30rpx;
color: @font-color;
&:before{
display: inline-block;
content: '';//内容
width: 12rpx;
height: 12rpx;
border-radius: 50%;
background-color: red;
}
}总之，inline-block就是保留了inline的不换行性，又增加了block的可设置高度性。
