Tag Archives: CSS

在前面一篇文章《CSS3中的边框效果》中，我们介绍了几种CSS3中的边框效果。今天，本文将接着介绍几种简单的、容易实现的CSS3文字处理效果，包括文字包裹、文字阴影、文字背景修饰、链接颜色渐变、文本选择颜色设置等。因为目前各个浏览器对CSS3的支持程度不一样，所以某些效果可能在有些浏览器中无法展现！这些效果在Chrome中全部通过测试有效，所以如果想欣赏到全部的CSS3效果，请切换到Chrome浏览器！ 1. 文字包裹效果 word-wrap属性取值有两个：normal和word-break，在处理长的英文字符串时特别有用。如下面示例，为创造一个长的字符串，我将句子用-替换空格，当使用normal时，字符串会溢出，但使用word-break时，字符串会自动截断并换行。将其和overflow配合使用（word-wrap:break-word;overflow:hidden;），可以有效的处理字符串溢出的问题。

本文将介绍几种简单的、容易实现的CSS3边框效果，包括阴影效果、圆角矩形、边框形状渐变、边框颜色渐变、自定义边框图片背景、border-box等。因为目前各个浏览器对CSS3的支持程度不一样，所以某些效果可能在有些浏览器中无法展现！这些效果在Firefox中全部通过测试有效，所以如果想欣赏到全部的CSS3效果，请切换到Firefox浏览器！ 阴影效果 阴影效果接受多个参数值。第一个是阴影的颜色，它还接受另外四个长度（lenght）值，前两的长度值分辨是X（水平）偏移量和Y（垂直）偏移量。接下一个参数是反映模糊度的数值。第四也是最后一个值是用来定义模糊的散布程度。

1，理解CSS盒模型（ Box Model） CSS盒模型是网页布局的基础，如果你想要实现跨浏览器布局的一致性，这是第一个必需透彻学习的对象。好在，它并不难掌握而且通常在所有浏览器上的效果都是一样的，除了某些情况下会与IE的版本相关（这个后面会详细谈到）。