网页设计中的前景色影响边框

影响边框

网站建设中的color值还可以影响元素周围的边框。假设已经声明了以下样式,其结果如图9-4所示:

p.aside{color:gray;border-style:solid;}

图9-4:边框颜色取自内容的颜色

元素<p class="aside">有灰色文本和灰色中等宽度的实线边框。这是因为,默认地前景色会应用到边框。要覆盖这种行为,最基本的办法是使用属性border-color:

p.aside{color:gray;border-style:solid;border-color:black;}

这会使文本为灰色,但边框是黑色。为border-color设置的值总会覆盖color值。

有时,利用边框可以影响图像的前景色。由于图像本身就由颜色组成,所以实际上网站建设这些使用color是无法影响的,不过可以改变图像周围任何边框的颜色。这可以利用color或border-color做到。因此,以下规则对class为type1和type2的图像有相同的视觉效果,如图9-5所示:

img.type1{color:gray;border-style:solid;}

img.type2{border-color:gray;border-style:solid;}

图9-5:为图像设置边框颜色

网站建设、网络营销咨询专线:0871-63535511(点击可一键拨号)