CSS, How to use Shorthand Borders.

Saturday, 1. August 2009

Border properties can be converted to the shorthand border property. The <h1> element can be styled with border-width, border-style. and border-color or with a single border property.

Longhand Properties

h1, h2 {
text-align: center;
color: navy;
}

h1 {
border-width: 1px;
border-style: solid;
border-color: gray;

}

h2{
font: italic small-caps bold 100%/120% arial, helvetica, sans-serif;
}

p {
color: maroon;
font: 80% arial, helvetica, sans-serif;
}

Shorthand Border

h1, h2 {
text-align: center;
color: navy;
}

h1 {
border: 1px  solid gray;
}

h2{
font: italic small-caps bold 100%/120% arial, helvetica, sans-serif;
}

p {
color: maroon;
font: 80% arial, helvetica, sans-serif;
}