X Course Advisor FREE Course Advisor
(Close)
Watch Tutorials
macProVideo.com
Close
如何创建在CSS3文字阴影
翻译谷歌翻译

正如我在我的教程中提到的创建圆角 CSS3提供了很多可怕的新功能,如多列,梯度,当然,边界效应。在本教程中,我们将看看另一项新功能,创建文本上的阴影。

This CSS property is supported by the most recent versions of all popular browsers except Internet Explorer...

第1步

要开始使用此效果,查找或创建一个CSS规则,你想申请文本阴影。也许是最好的方法,使本会创造一个阶级统治的具体运用这种效果。这正是我打算做的工作。我还采用了我的文本格式,使用重新定义的段落元素位。

第2步

下一步,添加“文字阴影”规则的属性。有四个值,我们可以适用于“文字阴影”属性。首先,添加一种颜色。您可以使用任何你喜欢的话,虽然通常是相当黑暗的阴影颜色。如果您保存的文件,并检查您在浏览器中的工作,你会发现什么也没有发生。这是因为我们必须先设置一些额外的属性。

第3步

Directly after the color, let's set three numeric values. The first two values can be positive or negative. The last value must be positive.


Now what are these values for? Well, the first value is for the horizontal position of the drop shadow. A positive value will move the shadow to the right, and a negative value moves it to the left.

第二个值控制阴影的垂直位置。这里的一个正面价值将向下移动的影子,而负值是向上移动。

第三个值,控制量的模糊阴影。使用较低的值,一个更清晰的阴影,或为一个更模糊的影子的更高的价值。正如你可以看到,我宁愿用相当低的数值。

这是建立在CSS3文字阴影的所有!继续检查下面的教程CSS学习之旅:

Geoff Blake

Geoff Blake | Articles by this author

Geoff Blake is a book author, video presenter, designer, and visual artist. As an in demand live-on-stage software educator since 1997, Geoff has taught desktop publishing, web design and graphics courses all over North America and is regarded as an expert in Adobe's Creative Suite applications, as well as in HTML, CSS, WordPress, and related technologies. With his humorous, non-jargonny approach, Geoff produces highly regarded articles, video training and DVDs, and regularly contributes to top industry magazines and websites.

Comments

You must be logged in to post a comment.
Create an Account  Login Now

What is macProVideo.com?

macProVideo.com is an online education community featuring Tutorial-Videos & Training for popular Audio & Video Applications including Adobe CS, Logic Studio, Final Cut Studio, and more.
© 2018 macProVideo.com
a division of NonLinear Educating Inc.
Link