Borders in CSS3

23 Feb

In CSS3 border attribute have a lot of option do design it
in below example there are 8 types of different colors to a single block

.borderColor{
border:8px solid #000000; /*as we taken width 8px; we can give 8 different color values */
/*you must define border-top, border-right, border-bottom, and border-left separately to get the effect below.*/
-moz-border-top-colors:#bc0909 #10ca49 #bbca10 #753705 #056975 #b90dcd #f60aff #662b68;
-moz-border-right-colors:#bc0909 #10ca49 #bbca10 #753705 #056975 #b90dcd #f60aff #662b68;
-moz-border-bottom-colors:#bc0909 #10ca49 #bbca10 #753705 #056975 #b90dcd #f60aff #662b68;
-moz-border-left-colors:#bc0909 #10ca49 #bbca10 #753705 #056975 #b90dcd #f60aff #662b68;
width:300px;
height:100px;
background:#CCCCCC;
padding:15px;
margin-left:20px;
}

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: