How to make buttons transparent in css

In css, you can use the opacity attribute to set the button transparency, the syntax "opacity: value", where the value range is between "0.0-1.0"; when the value is 1, it means completely opaque, when the value is 0.5 When the value is 0, it means semi-transparent. When the value is 0, it means completely transparent.

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

css can use the opacity attribute to set the button transparency effect, and the opacity attribute in css sets the opacity level of the element. IE8 and earlier support alternative filter attributes. For example:

filter:Alpha(opacity=50).

css uses the opacity attribute to set the opacity level of an element.

Syntax:

opacity: value|inherit;

Attribute value:

value Specifies opacity. From 0.0 (fully transparent) to 1.0 (fully opaque).

inherit The value of the opacity attribute should be inherited from the parent element.

Example:

Use the opacity attribute to set the button transparency effect

HTML code

<span id="testbtntext">查看</span>
<input type="button" class="btn_blue" id="testbtn" value="查看" />

css code:

#testbtn{
    filter:Alpha(opacity=0.3);
    -moz-opacity:0.3;
    opacity:0.3;
  }
#testbtntext{
    color:#000;
    position:relative;
    right:-px;top:0px;
 }

Rendering:

Recommended learning: css video tutorial

The above is the detailed content of How to make buttons transparent in css. For more information, please follow other related articles on the PHP Chinese website!