Shorthand Property

Obviously, there are many properties to consider when dealing with borders. To shorten the code, it is also possible to specify all the individual border properties in one property, called a shorthand property. The border property is a shorthand for the following set of border properties:

HTML file: Displayed by browser:
<style>
p.one {
   border: 5px solid red;
}
p.two {
   border: thick double #98bf21;
}
p.three {
   border: 1.5em ridge rgb(0,0,255) ;
}
</style>
<body>
<p class="one">Text in 5-pixel-wide solid border in red.</p>
<p class="two">Text in thick, double lined border in Hex #98bf21 color.</p>
<p class="three">Text in 1.5em wide ridged border in rgb(0,0,255) color.</p>
</body>

Text in 5-pixel-wide solid border in red.

Text in thick, double lined border in Hex #98bf21 color.

Text in 1.5em wide ridged border in rgb(0,0,255) color.


Back button Table of Contents Next button