text-shadow可以用来设置文本的阴影效果。

语法：

text-shadow: X-Offset Y-Offset blur color;

X-Offset：表示阴影的水平偏移距离，其值为正值时阴影向右偏移，反之向左偏移；

Y-Offset：是指阴影的垂直偏移距离，如果其值是正值时，阴影向下偏移，反之向上偏移；

Blur：是指阴影的模糊程度，其值不能是负值，如果值越大，阴影越模糊，反之阴影越清晰，如果不需要阴影模糊可以将Blur值设置为0；

Color：是指阴影的颜色，其可以使用rgba色。

比如，我们可以用下面代码实现设置阴影效果。

text-shadow: 0 1px 1px #fff
例子：
<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>text-shadow</title>

<style type="text/css">

.demo {

    width: 350px;

    padding: 30px;

    font: bold 55px/100% "微软雅黑";

    background: #C5DFF8;

    text-shadow: 2px 3px 0 red;

}

</style>

</head>

<body>

<div class="demo">text-shadow</div>

</body>

</html>

效果：

【CSS3】---文本阴影text-shadow的更多相关文章

  1. CSS3文本阴影、边框阴影

    CSS3添加阴影 一.使用text-shadow属性为文本添加阴影 二.使用box-shadow属性为边框添加阴影 一.为文本添加阴影 text-shadow     使用text-shadow,可以 ...

  2. CSS3文本温故

    1.CSS早期属性,分为三大类:字体.颜色和文本: 2.CSS文本类型有11个属性: 注:还有一个颜色属性:color,主要用来设置文本颜色 3.CSS3文本阴影属性:text-shadow语法:te ...

  3. CSS文本阴影实例

    原文 简书原文:https://www.jianshu.com/p/5abf2fa2f1b9 前言 以下的实例是我从<CSS实战>中看到的实例,当我看到这些实例的时候,发现平时不是很在意的 ...

  4. css3 文本效果

    CSS3 文本效果   1 CSS3 文本阴影在 CSS3 中,text-shadow 可向文本应用阴影,能够规定水平阴影.垂直阴影.模糊距离,以及阴影的颜色.text-shadow: 5px 5px ...

  5. CSS3 一、文本阴影text-shadow属性

    文本阴影text-shadow属性特效: 1.右下角阴影,左下角阴影,左上角阴影,右上角阴影 <!DOCTYPE html> <html lang="en"> ...

  6. CSS3 文本效果(阴影)

    CSS3中包含几个新的文本特征. 在本章中您将了解以下文本属性: text-shadow box-shadow text-overflow word-wrap word-break CSS3 的文本阴 ...

  7. CSS3 --添加阴影（盒子阴影、文本阴影的使用）

     CSS3 - 给div或者文字添加阴影(盒子阴影.文本阴影的使用)CSS3定义了两种阴影:盒子阴影和文本阴影.其中盒子阴影需要IE9及其更新版本,而文本阴影需要IE10及其更新版本.下面分别介绍两种 ...

  8. HTML 学习笔记 CSS3 (文本效果)

    text-shadow 语法 text-shadow : none | <length> none | [<shadow>, ] * <shadow> 或none ...

  9. CSS3：CSS3 文本效果

    ylbtech-CSS3:CSS3 文本效果 1.返回顶部 1. CSS3 文本效果 CSS3 文本效果 CSS3中包含几个新的文本特征. 在本章中您将了解以下文本属性: text-shadow bo ...

  10. 第 21 章 CSS3 文本效果

    学习要点: 1.文本阴影 2.文本裁剪 3.文本描边 4.文本填充 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS3 中文本效果,其中也包含一些之前讲过的 CSS3 文本属性. 一．文本阴影 ...

随机推荐

  1. extjs表格下的分页条——Ext.grid.Panel 的 pagingtoolbar

    两种分页条:每页固定条数的分页条 和 自定义选择每页内容条数的分页条 一.每页固定条数的分页条 这种样式的-- dockedItems: [{ xtype: 'pagingtoolbar', stor ...

  2. Java学习笔记之接口

    一.接口的概念与定义 首先考虑一个简单的接口的定义: public interface Output { int MAX_LINE = 40; void out(); void getData(Str ...

  3. 【M30】代理类

    1.考虑二维数组,在栈上分配,必须在编译时确定大小,也就是大小是常量.另外一点,C++不支持在堆上分配二维数组.怎么解决这个问题? 二维数组可以看成,一维数组的数组.因此,可以使用代理类,Array2 ...

  4. CDOJ 第七届ACM趣味程序设计竞赛第三场（正式赛） 题解

    宝贵资源 题目连接: http://acm.uestc.edu.cn/#/problem/show/1265 题意 平面上给n个点(n<=1000),要求找一个面积最小的正方形,将所有的点都囊括 ...

  5. cdoj 04 Complete Building the Houses 暴力

    Complete Building the Houses Time Limit: 20 Sec  Memory Limit: 256 MB 题目连接 http://acm.uestc.edu.cn/# ...

  6. 【JavaScript】JS跨域设置和取Cookie

    cookie 是存储于访问者的计算机中的变量.每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie.你可以使用 JavaScript 来创建和取回 cookie 的值.本文主要JS怎样 ...

  7. android调用系统相机拍照并保存在本地

    import java.io.File; import java.io.FileNotFoundException; import java.io.FileOutputStream; import j ...

  8. 分布式存储系统sheepdog

    Sheepdog,是由NTT的3名日本研究员开发的开源项目,主要用来为虚拟机提供块设备. 其架构例如以下: 以下,我们将从架构.模块等几个方面来介绍下: 一.架构图 如上图: 採用无中心节点的全对称架 ...

  9. Centos系统使用vpnc连接cisco的vpn服务

    安装vpnc 因为Centos官方源中,所含的软件安装包较少,这里需增加Fedora的源,依次执行: sudo rpm -ivh http://dl.fedoraproject.org/pub/epe ...

  10. mysql中如何嵌套使用insert和select

    如何在mysql从多个表中组合字段然后插入到一个新表中,通过一条sql语句实现.具体情形是:有三张表a.b.c,现在需要从表b和表c中分别查几个字段的值插入到表a中对应的字段.对于这种情况,我们可以使 ...