在CSS中,text-shadow是给文本添加阴影效果.

box-shadow则是给元素块添加周边阴影效果。 box-shadow基本的语法形式如下

box-shadow: [inset] x-offset y-offset blur-radius spread-radius color

box-shadow: [投影方式] [X轴偏移量] [Y轴偏移量] [阴影模糊半径] [阴影扩展半径] [阴影颜色]

[投影方式]:  可选参数. 如果不设值,默认投影方式是外部阴影. 如果取值"inset" (它的唯一值),它投影为内阴影.

[X轴偏移量 X-offset]: 阴影水平偏移量,其值可以是正负值. 如果值为正值,则阴影在对象的右边, 如果值为负值,阴影在对象的左边

[Y轴偏移量 Y-offset]:阴影垂直偏移量,其值也可以是正负值。如果为正值,阴影在对象的底部,其值为负值时,阴影在对象的顶部;

阴影模糊半径:此参数可选,,但其值只能是为正值,如果其值为0时,表示阴影不具有模糊效果,其值越大阴影的边缘就越模糊;

阴影扩展半径:此参数可选,其值可以是正负值,如果值为正,则整个阴影都延展扩大,反之值为负值时,则缩小;

阴影颜色:此参数可选。如不设定颜色,浏览器会取默认色,但各浏览器默认取色不一致,特别是在webkit内核下的safari和chrome浏览器下表现为透明色,在Firefox/Opera下表现为黑色(已验证),建议不要省略此参数。

CSS学习系列3--CSS3中的box-shadow的使用的更多相关文章

  1. CSS学习系列4 -- 再说CSS中的浮动运用及clear:left/right实际用法

    在 CSS学习系列2 -- CSS中的清除浮动 中,我们详细说了CSS中清除浮动的方法及使用 后来我自己在项目开发一个需要使用浮动的网页时,进行了实际运用,加上后来看到一篇好文章.所以就在这里再次写篇 ...

  2. CSS学习系列2 -- CSS中的清除浮动

    CSS中有一个很常见的问题,就是元素的浮动. 那么,到底什么是元素的浮动呢,我们来看一个例子 举个例子,在一个div里面内部有浮动元素的话,这个浮动元素会让这个div的高度塌陷. .myDiv{ ba ...

  3. CSS学习笔记之CSS3新特性

    目录 1.边框 2.背景 3.文本 4.字体 5.转换 6.过渡 7.动画 8.多列 9.自定义尺寸 CSS 用于控制网页的样式和布局,而 CSS3 是最新的 CSS 标准,这篇文章将着重介绍 CSS ...

  4. JavaScript学习系列5 ---ES6中的var, let 和const

    我们都知道JavaScript中的var,在本系列的 JavaScript学习系列2一JavaScript中的变量作用域 中,我们详细阐述了var声明的变量的作用域 文章中提到,JavaScript中 ...

  5. CSS学习系列1 - CSS中的盒子模型 box model

    css中有一个盒子模型的概念. 主要是用来告诉浏览器如何来计算页面元素的宽度和高度, 比如该元素的宽度/高度 是否包括内边距,边框,外边距.  盒子模型有一个属性box-sizing属性来说明是否包括 ...

  6. java学习系列(一)Java中的IO操作

    Java的IO流是实现输入/输出的基础,它可以方便地实现数据的输入\输出操作,在Java中把不同的输入\输出源抽象为"流",通过流的方式允许Java程序使用相同的方式来访问不同的输 ...

  7. gradle学习系列之eclipse中简单构建android项目

    看不到图片能够去訪问这个网址看看:http://pan.baidu.com/s/1o6FrFkA 一.什么是Gradle 官网www.gradle.org上介绍Gradle是升级版(evolved)的 ...

  8. JavaScript学习系列8 - JavaScript中的关系运算符

    JavaScript中有8个关系运算符,分别是 ===, !===, ==, !=, <, <=, >, >= 1. 恒等运算符 (===) ===也叫做 严格相等运算符,它要 ...

  9. JavaScript学习系列7 -- JavaScript中的运算符

    今天,我们来说一说JavaScript中的运算符,首先我们来讲一讲 一元运算符 JavaScript中的一元运算符有以下几种 1. delete delete 运算符主要用于删除对以前定义的对象属性或 ...

随机推荐

  1. Keep DNS Nameserver Order Consistency In Neutron

    一个subnet有多个dns server时,dns server在创建时就定好了,但可以update: neutron subnet-update 1a2d261b-b233-3ab9-902e-8 ...

  2. 创建 CSS3 下拉菜单

    1. [图片] 菜单效果 2. [代码]menu.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" ...

  3. linux命令学习笔记(3):pwd命令

    Linux中用 pwd 命令来查看”当前工作目录“的完整路径. 简单得说,每当你在终端进行操作时, 你都会有一个当前工作目录. 在不太确定当前位置时,就会使用pwd来判定当前目录在文件系统内的确切位置 ...

  4. Nginx-rtmp模块实现流媒体play、push、pull功能

    官方wiki:https://github.com/arut/nginx-rtmp-module#readme Nginx rtmp 功能特点 1.   支持音视频直播 2.   支持flv/mp4视 ...

  5. POJ3294Life Forms(广义后缀自动机)(后缀数组+二分+数状数组)

    You may have wondered why most extraterrestrial life forms resemble humans, differing by superficial ...

  6. wcf win7上使用net.tcp出现不支持协议问题解决

    第一:iis绑定 net.tcp 808:* 第二:iis 应用中高级开启协议,添加net.tcp多协议逗号隔开 第三:开启各项服务 第四:执行 ServiceModReg.exe -r

  7. C#实现读写文本文件中的数据

    [1]首先我们定义一段假数据,这里以一个string为例字 static void Main(string[] args)        {            string data = &quo ...

  8. [Codeforces 1139D] Steps to One

    [题目链接] https://codeforces.com/contest/1139/problem/D [算法] 考虑dp 设fi表示现在gcd为i , 期望多少次gcd变为1 显然 , fi = ...

  9. BZOJ3545:[ONTAK2010]Peaks

    浅谈线段树合并:https://www.cnblogs.com/AKMer/p/10251001.html 题目传送门:https://lydsy.com/JudgeOnline/problem.ph ...

  10. NET Remoting 最简单示例

    NET Remoting 最简单示例 2014-01-21 15:29 10492人阅读 评论(4) 收藏 举报  分类: .NET(6)  版权声明:本文为博主原创文章,未经博主允许不得转载. 学习 ...