使用 CSS 控制文字阴影和样式可以通过以下属性实现:
文字阴影可以通过 text-shadow
属性实现,语法如下:
text-shadow: h-shadow v-shadow blur color;
h-shadow
:水平阴影的位置,可以是负值(向左)或正值(向右)v-shadow
:垂直阴影的位置,可以是负值(向上)或正值(向下)blur
:模糊距离color
:阴影的颜色例如,要创建一个黑色阴影,模糊距离为 2px,水平和垂直位置均为 0px 的文本阴影,可以这样写:
p {
text-shadow: 0px 0px 2px #000000;
}
文字样式可以通过 font-weight
属性实现,语法如下:
font-weight: value;
value
:可以是以下值之一:normal、bold、bolder、lighter 或 100、200、300、400、500、600、700、800、900例如,要将一个段落中的文字样式设置为加粗,可以这样写:
p {
font-weight: bold;
}
在编写 CSS 样式时,可以使用多种选择器来选择不同的元素,例如:
h3 {
text-shadow: 2px 2px 2px #000000;
font-weight: bold;
}
.highlight {
color: red;
}
pre {
background-color: #eee;
padding: 10px;
border: 1px solid #ccc;
}
上面的 CSS 样式实现了以下效果:
h3
选择器选择所有 <h3>
元素,并将它们的文字阴影设为水平和垂直都为 2px,模糊距离为 2px,颜色为黑色。同时将它们的文字样式设为加粗。.highlight
选择器选择所有 class
属性为 highlight
的元素,并将它们的文字颜色设为红色。pre
选择器选择所有 <pre>
元素,并将它们的背景颜色设为浅灰色,内边距设为 10px,边框为 1px 的灰色实线。