CSS3设计文本阴影案例
郭亚东
(北京信息职业技术学院)
摘 要:本文档给出了CSS3设计文本阴影案例。
关键词: CSS3$设计文本阴影$案例
案例1
说明:本案例演示为段落文本定义一个简单阴影效果的具体用法。
源代码如下:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>设置文本阴影效果<title>
<style type="textcss">
p {
text-align: center;
font:bold 60px helvetica, arial, sans-serif;
color: #999;
text-shadow: 0.1em 0.1em #333;
}
<style>
<head>
<body>
<p>HTML5+CSS3<p>
<body>
<html>
运行以上代码,效果如图 1 所示。
图 1 定义文本阴影效果
案例2
说明:本案例演示为段落文本设置左上角阴影效果的具体用法。
源代码如下:
<!doctype html>
<html>
1 / 5
CSS3 设计文本阴影案例