直接上代码:

<style type="text/css">
.mydiv{
   width:250px;

height:auto;

border:#909090 1px solid;

background:#fff;

color:#333;

filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);

-moz-box-shadow: 2px 2px 10px #909090;

-webkit-box-shadow: 2px 2px 10px #909090;

box-shadow:2px 2px 10px #909090;
}
</style>

for IE:
direction 阴影角度 0°为从下往上 顺时针方向
strength  阴影段长度

-moz-box-shadow: 2px 2px 10px #909090;
-webkit-box-shadow: 2px 2px 10px #909090;
box-shadow:2px 2px 10px #909090;

第一个参数是x轴阴影段长度
第二个参数是y轴阴影段长度
第三个参数是往四周阴影段长度
第四个参数是阴影段颜色

div代码:
<div class="mydiv">
    123123213123
</div>

效果如下:

来自:http://www.cnblogs.com/si-shaohua/p/4279220.html

css给div添加阴影效果的更多相关文章

  1. css 给div 添加滚动条样式hover 效果

             css .nui-scroll { margin-left: 100px; border: 1px solid #000; width: 200px; height: 100px; ...

  2. css 给div添加滚动并隐藏滚动条

    在html中 <div class="box"> <div>下面内容会单独滚动</div> <div class="scroll ...

  3. css给div添加0.5px的边框

    具体代码实现如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  4. Div添加阴影效果

    -moz-box-shadow: 2px 2px 10px #909090;/*firefox*/ -webkit-box-shadow: 2px 2px 10px #909090;/*safari或 ...

  5. 使用CSS为图片添加边框的几种方法

    css的应用十分广泛,即便用在图片的效果中也是方法多样,本文下面就介绍五种为图片添加特殊效果边框的CSS写法阴影效果 通过使用带有一些padding之的背景图来添加阴影效果. HTML <img ...

  6. 使用CSS为图片添加更多趣味的5种方法

    使用Photoshop为每个图片添加某种样式虽然可行,但会是相当乏味且困难的长久工作.下面要介绍的CSS技巧将帮助你从痛苦中解脱出来! 阴影效果 通过使用带有一些padding之的背景图来添加阴影效果 ...

  7. CSS样式div

    页面中,有很多样式标签:div标签,对标签定位的地方有: 1.<head>标签里加<style>标签,在<style>标签中添加样式.如: <style> ...

  8. css实现div多边框_box-shadow模拟多边框、outline描边实现

    在css3中我们知道可以使用box-shadow属性轻松的为元素添加阴影效果,并且可以设置多组效果,每组参数值用逗号隔开.如果把box-shadow特性的两个偏移量 h-shadow .v-shado ...

  9. CSS之div和span标签

    div和span是非常重要的标签,div的语义是division"分割": span的语义就是span"范围.跨度". 这两个东西,都是最最重要的"盒 ...

随机推荐

  1. Linux 环境下java安装及配置

    操作系统环境: Red Hat Enterpriser  Linux 6.5 jdk版本:  jdk1.8.0_144 1 从官网下载Linux操作系统对应的jdk版本文件 2 安装jdk 3 安装完 ...

  2. C语言定义从URL中获取键值的接口

    环境:centos7下,对客户端http请求进行解析,来获取有效键值(包括汉字). 头文件 /* 这是一份关于从Http请求信息中提取键值的接口声明的头文件 */ #ifndef _HEAD_H_ # ...

  3. Android shared_preference操作

    实例化SharedPreferences对象 //test :想要打开的SharedPreferences文件名 //Activity.MODE_PRIVATE:操作模式 MODE_PRIVATE | ...

  4. Entity Framework 之Code First自动数据迁移

    using MvcShopping.Migrations; using MvcShopping.Models; using System; using System.Collections.Gener ...

  5. 大数据算法设计模式(2) - 左外链接(leftOuterJoin) spark实现

    左外链接(leftOuterJoin) spark实现 package com.kangaroo.studio.algorithms.join; import org.apache.spark.api ...

  6. java 静态代码块 代码块 构造函数 静态成员变量 成员变量的初始化顺序

    没有父类的情况 1,静态代码块-->静态成员变量-->成员变量(实例属性)-->代码块-->构造函数 2, 静态代码块 和 静态成员变量 只会初始化一次 有父类的情况 1,父类 ...

  7. GooglePlay - 文件上传限制的扩展

    前言 Google Play应用商店在上传限制100MB大小,超过该大小的应用必须将超过部分以扩展文件的形式进行上传处理. 总共可上传2个扩展文件,每个最大文件可为2GB,同时obb文件格式可自选. ...

  8. 创建mongodb副本集操作实例

    一:概念 相关概念及图片引用自这里 mongodb副本集: 副本集是一组服务器,其中一个是主服务器,用于处理客户请求:还有多个备份服务器,用于保存主服务器的数据副本.如果主服务器崩溃了,备份服务器自动 ...

  9. 在centos6编译配置httpd2.4的N种方法

    前言 我们使用linux的过程中,一定会用到httpd这个服务,在centos7上,默认安装的httpd就是2.4版本,大家都知道,2.4版本相对之前的版本已经做了改进,用起来更加方便,但是我们的ce ...

  10. ModelForm

    这是一个神奇的组件,通过名字我们可以看出来,这个组件的功能就是把model和form组合起来,对,你没猜错,相信自己的英语水平. 先来一个简单的例子来看一下这个东西怎么用: 比如我们的数据库中有这样一 ...