CSS 为 html 标记语言提供了一种样式描述, 定义了其中元素的显示方式. 那么 CSS 怎么设置边框透明度呢? 下面我们来看一下 CSS 如何设置边框透明度.
CSS 怎么让边框透明:
运用 RGBA, 红色和绿色和蓝色三个百分比都为 200,a 为参数, 可以设置成 0 到 1 之间的数字, 但是千万不要为负值, 语法如下:
.div {background: rgba(200,200,200,0.75);}
接下来, 我们给 div 增加样式, 首先先设置上下左右四个边框, 同时设置四个边框设置相同高度和宽度, 代码如下:
- div
- {
- width: 100px; height:100px;
- border-top:10px solid rgba(200,200,200,0.25);
- border-right:10px solid rgba(200,200,200,0.5);
- border-bottom: 10px solid rgba(200,200,200,0.75);
- border-left:10px solid rgba(200,200,200,1);
- }
显示效果:
我们可以通过对参数的改变的, 就可以调整边框的透明度, a 的参数越大, 就表示颜色越深, a 的值为 0 就显示透明.
rgba 色彩模式与 RGB 相同, 只是在 RGB 模式上新增了 Alpha 透明度.
RGBA(R,G,B,A)
取值:
R: 红色值. 正整数 | 百分数
G: 绿色值. 正整数 | 百分数
B: 蓝色值. 正整数 | 百分数
A:Alpha 透明度, 取值 0~1 之间.
推荐: CSS 文档 https://www.html.cn/book/css/
来源: http://www.css88.com/qa/css3/14109.html