css中的transparent是什么意思有什么作用?
经常在别人网站的样式表中,看到有用transparent这个的,但是不知道是什么意思?
于是就去查了一下相关资料,在这里分享一下。
transparent是用来指定全透明色彩。
transparent是全透明黑色(black)的速记法,类似于rgba(0,0,0,0)这样的值。
在CSS1中,transparent被用来作为background-color的一个参数值,其表示背景透明。
在CSS2中,border-color也开始接受transparent作为参数值,接着后面又延伸到color也接受transparent作为参数值。
在CSS3中,transparent被延伸到任何一个有color值的属性上都可以使用。
html代码<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<meta charset="utf-8" />
<title>CSS参考手册transparent实例</title>
<style>
.text {
color: transparent;
border: 1px solid transparent;
background: transparent;
}
</style>
</head>
<body>
<div class="text">将color、border、background的属性设置为transparent时的效果(透明,页面将一片空白)</div>
</body>
</html>
其实background默认的颜色就是透明的属性,但是为什么css中还要有transparent这个呢?
试想一下,如果一个元素需要将其覆盖在另一个元素之上,而我们又需要显示下面的元素,怎么办呢?
是使用透明度(filter、opacity)吗?
还是其他方法呢?
这时候其实使用transparent是最好的。