Opacity – CSS3


The most widely implemented feature of CSS3 up till now is opacity. It’s probably also the one people have been waiting for the most

The following codes will help you get a more clear idea.


style="background: rgb(255, 0, 0) ; opacity: 0.2;"
style="background: rgb(255, 0, 0) ; opacity: 0.4;"
style="background: rgb(255, 0, 0) ; opacity: 0.6;"
style="background: rgb(255, 0, 0) ; opacity: 0.8;"
style="background: rgb(255, 0, 0) ; opacity: 1;"

Advertisements

How to create colored borders with CSS3


W3C has offered some new options for borders in CSS3, of which, next to rounded borders, border-color is also very interesting. Mozila/Firefox has implemented this function, which allows you to create cool colored borders. A sample code has been shown below :

border: 8px solid #000;
-moz-border-bottom-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-top-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-left-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-right-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
padding: 5px 5px 5px 15px;