小程序: 三栏布局的五种实现方式及优缺点

浮动布局的优点就是比较简单，兼容性也比较好。

缺点是浮动元素是脱离文档流，要做清除浮动，否则可能会出现高度塌陷等问题。

绝对定位布局优点: 很快捷，设置很方便.

但是脱离文档流的, 可能会造成重叠元素

在flex布局不兼容的时候，可以尝试表格布局。

CSS基础（float属性与清除浮动）

三栏布局的5种解决方案及优缺点

方法/步骤

文字的大小颜色。

.text{

font-size: 1.6em/*文字大小*/

color: #ff00ff/*文字颜色*/

text-align: center/*文字居中*/

}

图片的样式控制，长度宽度。

.images{

width: 100%

height: auto

}

按钮样式<button>，可以用官网给的样式，可以了自己设定。

button{

width: 50%/*长度*/

background: #ff0/*背景颜色*/

color: #969696/*字体颜色*/

border-radius:5px/*边角原弧度*/

}

button::after{

border: 10px solid #969696/*边框*/

}

透明度，

opacity: 0.3

最多1.0。

浮动和边距，

.fd{

border: 1px solid red/*边框*/

width: 15%/*长度*/

float: left/*浮动*/

margin-left: 20px/*距离左侧*/

}

6

WXSS基本和CSS一样，更多的样式以及详细，请认真学习css

1、需要cover-view替代那些本身需要覆盖在上面的view。

2、原来view的文字居中，cover-view无效，需要cover-view的嵌套大发，就是文字放到cover-view上，由父级的cover-view让子cover-view居中即可。

3、cover-view的存在绝对位置的情况下，也就是position：absolute；，此时父级的居中无效。

4、cover-view是覆盖在原生标签上的。

---