Home  >  Article  >  Web Front-end  >  How to set translucent border in css?

How to set translucent border in css?

黄舟
黄舟Original
2017-07-19 11:01:562070browse

You can refer to my code below:

XXX:{
    border: 5px solid rgba(XXX, XXX, XXX, 0.5)
}

The first XXX is the element you choose that needs to be translucent
The next XXX is the element you want to be semi-transparent Transparent color
Set the transparency to 0.5 to make it translucent.

.transparent{
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}

filter:alpha(opacity=50):这个是为IE6设的,可取值在0-100,其它三个0到1.
-moz-opacity:0.5; 这个是为了支持一些老版本的Mozilla浏览器。
-khtml-opacity: 0.5; 这个为了支持一些老版本的Safari浏览器。
opacity: 0.5; 这是最重要的,因为它是CSS标准.该属性支持firefox, Safari和 Opera.

Hello, you can try using

border-style: solid;
border-color: rgba(250,0,255,0.7)

*Note: rgba corresponds to red, green, blue and transparent values ​​respectively, where the rgb interval is 0 (pure black ) to 255 (solid color) transparency a range from 0 (completely transparent) to 1 opaque

The above is the detailed content of How to set translucent border in css?. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn