Setting the Color of a Border

Setting the color of a border can be done in two ways. One way is to set it directly by including the color via the border properties, as done here:

 P { border: 5pt solid red } 

Figure 10.2(a) shows the result. We discussed this method in Chapter 8.

Figure 10.2. Different ways to set the color of a border using the color property: (a) setting the border using the border properties; (b) setting the border to the text color.

Another way is to set the color of the text that is the content of the element, as done here:

 P {   border: 5pt solid;   color: blue; } 

In this case, no color has been set on the border, so it assumes the color of the text, which is blue. This is shown in Figure 10.2(b).