html图片透明元素,CSS样式更改——多列、元素是否可见、图片透明度

原标题：CSS样式更改——多列、元素是否可见、图片透明度

前言

上篇文章主要讲述了CSS样式更改中的过渡、动画基础知识，这篇文章我们来介绍下CSS样式更改中多列、元素是否可见、图片透明度知识。。

1.多列 DoubleCol

1).创建多列

div

{

-moz-column-count:2; /* Firefox */

-webkit-column-count:2; /* Safari 和 Chrome */

column-count:2;

}

div被分隔成两列

2).规定列之间的间隔

div

{

-moz-column-gap:30px; /* Firefox */

-webkit-column-gap:30px; /* Safari 和 Chrome */

column-gap:30px;

}

规定列之间30像素的间隔

3).列规则

div

{

-moz-column-rule:1px dotted red; /* Firefox */

-webkit-column-rule:1px dotted red; /* Safari and Chrome */

column-rule:1px dotted red;

}

column-rule-width 列之间的宽度规则

column-rule-style 列之间的样式规则

column-rule-color 列之间的颜色规则

4).规定列的宽度和列数

div

{

columns:10px 3;

-moz-columns:10px 3; /* Firefox */

-webkit-columns:10px 3; /* Safari 和 Chrome */

}

column-width 列的宽度

column-count 列数

5).填充列

div

{

column-fill:auto;

}

balance 列处理

auto 自动填充

2.元素是否可见Visibility

div{

visibility:hidden

}

visible 元素可见

hidden 元素不可见

collapse 用在表格中元素可见，其它标签元素不可见

3.图片透明度0pacity

opacity:0.4 范围为0~1的小数

filter:alpha(opacity=100) 范围为0~100的整数

参考文档：W3C官方文档(CSS篇)

总结

这篇文章主要介绍了CSS样式更改篇中的多列、元素是否可见、图片透明度知识，希望让大家对CSS样式更改有个简单的认识和了解。

想要学习更多，请前往Python爬虫与数据挖掘专用网站：http://pdcfighting.com/返回搜狐，查看更多

责任编辑：