div
{
  box-shadow: 10px 10px 5px #888888;
}

语法:box-shadow: h-shadow v-shadow blur spread color inset;

值 描述 测试
h-shadow 必需。水平阴影的位置。允许负值。 测试
v-shadow 必需。垂直阴影的位置。允许负值。 测试
blur 可选。模糊距离。 测试
spread 可选。阴影的尺寸。 测试
color 可选。阴影的颜色。请参阅 CSS 颜色值。 测试
inset 可选。将外部阴影 (outset) 改为内部阴影。 测试

.mydiv{
  width:250px;height:auto;border:#909090 1px solid;background:#fff;color:#333;
  filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=3);/*ie*/
  -moz-box-shadow: 2px 2px 10px #909090;/*firefox*/
  -webkit-box-shadow: 2px 2px 10px #909090;/*safari或chrome*/
  box-shadow:2px 2px 10px #909090;/*opera或ie9*/
}

box-shadow向元素添加阴影效果的更多相关文章

  1. C#-WebForm-css box-shadow 给边框添加阴影效果

    box-shadow介绍 css3可以使用 box-shadow 属性轻松地为元素添加阴影效果,box-shadow可以设定多组效果,每组参数值以逗号分隔. 语法: box-shadow:x-shad ...

  2. 用JQuery动态为选中元素添加/删除类

    在做一些tab页功能时,我们经常会见到如下样式: 即当选中一个元素时,在此元素下会添加相应的类,以示区别.今天就研究了一下如何用JQuery实现此效果. 1. HTML代码 <a id=&quo ...

  3. JQuery_给元素添加或删除类等以及CSS()方法

    一.addClass() - 向被选元素添加一个或多个类 <script src="jquery-1.11.1.min.js"></script> < ...

  4. 如何设置box shadow的透明度

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期2014-04-24) 今天发现使用box-shadow属性,可以很好的给div添加阴影效果,但是添加的效果如果是: -moz-box- ...

  5. 给input元素添加float. 去除IE6 下input的空隙

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  6. css3 box-shadow属性 鼠标移动添加阴影效果

    text-shadow是给文本添加阴影效果,box-shadow是给元素块添加周边阴影效果. 基本语法:{box-shadow:[inset] x-offset  y-offset  blur-rad ...

  7. vue不同序号的元素添加不同的样式

    vue不同序号的元素添加不同的样式 一.总结 一句话总结: 在vue中设计一个样式的数据数组来遍历即可 <script> new Vue({ el:'#review_exam_part', ...

  8. 给DOM生成的元素添加事件

    问题:通过js给页面添加新元素,并给该元素添加绑定事件,但新添加的元素上却没有绑定任何事件. 常见例子:在处理表格的时候,每行行末有个删除按钮,如下图.点击删除按钮的时候删除这一行. //html部分 ...

  9. 给Jquery动态添加的元素添加事件

    给Jquery动态添加的元素添加事件 来源:[http://wangqixia.diandian.com/post/2011-05-10/6597866] 我想很多人都会向我一样曾经 被新元素的事件绑 ...

随机推荐

  1. struct timeval 计时问题

    linux编程中,如果用到计时,可以用struct timeval获取系统时间.struct timeval的函数原型如下: struct timeval { __kernel_time_t tv_s ...

  2. postgres数据库参数配置说明介绍

    访问 1. listen_addresses 监听访问地址 2. port 监听端口 3. max_connections 最大连接数 4. 性能 1. shared_buffers PostgreS ...

  3. css选择器与DOM'匹配的关系

    一道面试题 css 选择器匹配时,只考察是否包含有对应的class,而与class的顺序无关 而css的定义是后面的覆盖前面的定义 原理:http://www.w3.org/html/ig/zh/wi ...

  4. CodeIgniter使用中写的一些文章

    CI的captcha替代类库:  http://www.ifixedbug.com/posts/codeigniter-captcha-library 原生的captcha不是太好用,自己组装一个吧. ...

  5. sql--CONVERT、FOR XML PATH解决实际问题

    需求:每个平台分类下的门店,每个门店的名称.图片路径.评分,每个门店下的四个产品的名称.图片路径.评分 思路: 一开始门店动态化好写,用Ajax就行了.但是每个门店下面的产品,每个去请求一次查询有点不 ...

  6. (zxing.net)一维码Code 93的简介、实现与解码

    一.简介 一维码Code 93: Code 93码与Code 39码的字符集相同,但93码的密度要比39码高,因而在面积不足的情况下,可以用93码代替39码.它没有自校验功能,为了确保数据安全性,采用 ...

  7. 记开发个人图书收藏清单小程序开发(五)Web开发

    决定先开发Web端试试. 新增Web应用: 选择ASP.NET Core Web Application,填写好Name和Location,然后点击OK. 注意红框标出来的,基于.NET Core 2 ...

  8. 十二生肖查询网页版制作(php)

    今天无聊做了一个十二生肖查询器: 预览网址效果:http://hongxing01.hktd02u.me48.com/03Sxcx 源代码下载:http://down.51cto.com/data/1 ...

  9. mongodb 备份脚本

    ###############备份脚本#!/bin/bash basepath="/data/backup/dump$(date +%Y%m%d%H%M%S)" if [ ! -d ...

  10. LWIP

    LWIP 今天要谈的不是LWIP协议栈的内容,只是简单谈谈关于STM32F407快速使用LWIP做网络通讯的一些经历. 我是一个网络小白,对网络知识一窍不通,仅仅是知道有IP地址.网关这玩意,也从来没 ...