一、文本阴影效果
方法一：
显示字体时，根据要求，为文字阴影添加颜色以增强网页的吸引力，这时就需要用到CSS3样式中的text-shadow属性。
text-shadow：阴影水平偏移值（可正负）；阴影垂直偏移值（可正负）;阴影模糊值；阴影颜色。后两个属性可选。
<body>
<p align:center style="text-shadow:0.1em 2px 10px blue;font-size:80px;">这是TextShadow的阴影效果</p>
</body>效果图如下：
方法二：利用z-index设置阴影效果
<style type="text/css">
.shadow1{
font-family: "微软雅黑";
font-size: 60px;
font-weight: bold;
position: relative;
z-index: 1;
}
.shadow2{
color: #aaaaaa;
font-family: "微软雅黑";
font-size: 60px;
font-weight: bold;
position: relative;
top: -1.16em;
left: 0.1em;
z-index: 0;
}
</style>
<body>
<div class="shadow1">定位阴影效果</div>
<div class="shadow2">定位阴影效果</div>
</body>
二、文本溢出效果
text-overflow属性用来定义当文本溢出时是否显示省略号，要实现溢出产生省略号的效果，还需要定义：强制文本在一行显示（white-space：nowrap）以及溢出内容为隐藏（overflow：hidden）。
text-overflow：clip （不显示省略号标记，只裁切）| ellipsis（显示省略号标记）。
<body>
<style type="text/css">
.democlip{text-overflow:clip; overflow:hidden; white-space:nowrap; width:200px; background:#ccc}
.demoellipsis{text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:200px; background:#ccc}
</style>
<h2> text-overflow：clip</h2>
<div class="democlip">不显示省略号标记，而只是简单的裁切</div>
<h2> text-overflow：ellipsis</h2>
<div class="demoellipsis">显示省略号标记，不是简单的裁切</div>
</body>效果图如下：
1736
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
