Posts Tagged: 透明

交互设计 — No Comments
1
七 11

css3可以让背景、边框透明文字内容不透明

用css3的RGBA属性能单独控制div的背景、边框、内容透明目前支持的浏览器:Apple Safari 4, Firefox 3.0.5+, Google Chrome 1+

RGBA允许你控制某个特性填充颜色的不透明度，无论是文本、背景、边框还是背景颜色。

设置颜色透明度的时候，你需要使用RGB颜色值，不可以再使用十六进制值，而那个”A”则代表透明度，你可以设置从0(透明)到1(不透明)之间的数值。

1
rgba(0-255,0-255,0-255,0-1)

你还可以单独使用RGB值:

1
2
3
4
5
6
7
8
.topbox {
color: rgb(235,235,235);
color: rgba(255,255,255,0.75);
background-color: rgb(153,153,153);
background-color: rgba(0,0,0,0.5);
border-color: rgb(235,235,235);
border-color: rgba(255,255,255,0.65);
}

如果想让DIV背景透明，文字不透明，再也不用对DIV透明以后，还要把内容飘起来。现在直接写DIV的背景颜色透明“background-color: rgba(0,0,0,0.5);”就OK啦。