你应当了解的5个CSS3新技术（5）
作者：暴风彬彬 来源：彬Go 发布时间：2009-02-11 13:01:00
标签：css3,技术,样式,设计,圆角,透明度
5:阴影效果
实现阴影也有很多方法，最常用的就是使用Photoshop制作成阴影图片，然后应用到背景属性中。但CSS3让你的工作更有效率，不幸的是，目前只有Safari和Chrome支持这个新特性。
仅仅需要一行代码，不过它有4个不同的值:
-webkit-box-shadow: 3px 5px 10px #ccc;
下面我来解释一下这四个值都代表什么，第一个3px是指定阴影与div元素之间的水平(横向)距离，第二个5px指的是阴影与div之间的垂直(纵向)距离，第三个10px指的是阴影的模糊度(类似于photoshop中的羽化)，值越大越细腻。最后的值不说大家也知道，就是阴影的颜色。
我们最终阴影效果代码；
#shadow {
background-color: #fff;
border: 1px solid #000;
-webkit-box-shadow: 3px 5px 10px #ccc;
}
正如你看到的，我们个这个div设置了白色的背景，黑色的边框和亮灰色的阴影。
0
投稿猜你喜欢
在前面的DRF系列教程中，我们以博客为例介绍了序列化器, 使用基于类的视图APIView和ModelViewSet开发了针对文章资源进行增删- GO语言结构体方法跟结构体指针方法的区别首先，我定了三个接口、一个结构和三个方法：type DeptModeA interface {Nam
- 1、残差连接是目前常用的组件，解决了大规模深度学习模型梯度消失和瓶颈问题。通常，在10层以上的模型中追加残差连接可能有帮助。from ker
- 1、灵活运用样式 熟悉网页设计的网友就知道，调用Style的方法很多，我们可以单击鼠标右键选择Custon Style来调用Style标准，
- 异常的参数一个异常可以带上参数，可作为输出的异常信息参数。你可以通过except语句来捕获异常的参数，如下所示：变量接收的异常值通常包含在异
- Python range() 函数用法python range() 函数可创建一个整数列表，一般用在 for 循环中。函数语法range(s
- 前言使用 requests进行爬取、BeautifulSoup进行数据提取。主要分成两步： 第一步是解析图书列表页，并解析出里面的图书详情页
- 大家好，我是只谈技术不剪发的 Tony 老师。这次我们来介绍一个 MySQL 8.0 增加的新功能：检查约束（CHECK ）。SQL 中的检
- 1.列表：list# 1.list：Python内置的一种数据类型，列表；# 2.list是一种有序的集合，可以随时添加和删除其中的元素；#
- 看了两天 go 语言，是时候练练手了。go 的 routine（例程） 和 chan（通道） 简直是神器，实现多线程（在 go 里准确的来说
- 下载下来可是不会用啊,网上也找不到类似的方法,可能都没遇到过这样的问题,,经过一个晚上的研究demo及同事一起帮忙,终于研究出了如何使用,自
- GO 语言的 for…range 能做什么呢？for…range 如何使用 ?for…range 的返回
- 背景：读取TXT文件，加载到kafka中，然后通过logstash消费kafka中的数据加载到es中第一步：导入相应的依赖包pip inst
- 本文实例讲述了php函数连续调用的方法。分享给大家供大家参考。具体如下：<?php //返回$this，实现连续调用 class xi
- 一、Lambda表达式Lambda表达式又被称之为匿名函数格式lambda 参数列表：函数体def add(x,y): return x+y
- 本文实例讲述了Python切片操作。分享给大家供大家参考，具体如下：我们基本上都知道Python的序列对象都是可以用索引号来引用的元素的，索
- tornado 里面没有 session？不，当然有~我知道 github 上肯定有人帮我写好了~ O(∩_∩)O~
- 1、读取方法有按行（单行，多行连续，多行不连续），按列（单列，多列连续，多列不连续）；部分不连续行不连续列；按位置（坐标），按字符（索引）；
- 这几天在QQ群里知道了几个比较好的优化方面的站，感觉看高手的文章简直就是一种享受。和很多现在正在阅读这篇文章的站长一样，我即将毕业，但是还没
- 通过Python操作注册表有两种方式，第一种是通过Python的内置模块 _winreg；另一种方式就是Win32 Extension Fo
