直接上代码:

<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. pycharm 2017新建文件添加编码方式等

    file->setting->Editor->File and Code Templates->Python Script 添加 #!/usr/bin/python3# -*- ...

  2. SAP Gateway简介

    SAP Gateway在S4/HANA时代的ABAP开发模型中有着重要的地位.SAP Gateway是什么?它对ABAP开发有怎样的影响?可以为我们提供哪些方便?这篇译文将浅要地讨论这些话题. SAP ...

  3. JQuery&原生js ——实现剪刀石头布小游戏

    前言 jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库( 或JavaScript框架).jQuery设计的宗旨是“write L ...

  4. Python数据分析(二): Numpy技巧 (1/4)

    In [1]: import numpy numpy.__version__ Out[1]: '1.13.1' In [2]: import numpy as np  

  5. python --- socket模块详解

    socket常用功能函数: socket.socket(family=AF_INET, type=SOCK_STREAM, proto=0, fileno=None)                  ...

  6. asp.net 的发布与执行

    asp.net的工程文件在测试完成后就是发布(部署)和执行. 发布 本地发布的例子 1,菜单项  生成--发布 2,如果是第一次发布,点击自定义,设置配置文件的名称 3,发布方法--文件系统,设置本地 ...

  7. Android 中更新UI的方法

    1)使用Activity.runOnUiThread(Runable action)方法 情景一: 在主线程中,定义方法,在方法中启动线程. public class MainActivity ext ...

  8. jdbc学习总结

    jdbc学习总结:   一.简介: jdbc,直译为java连接数据库.实际为java为很好的操作数据库而提供的一套接口,接口的实现(即驱动)由各个数据库厂商提供.   二.知识要点: 连接5要素,3 ...

  9. 关于width与padding

    http://blog.csdn.net/yaoyuan_difang/article/details/24735529

  10. Mysql 学习之EXPLAIN作用

    一.MYSQL的索引 索引(Index):帮助Mysql高效获取数据的一种数据结构.用于提高查找效率,可以比作字典.可以简单理解为排好序的快速查找的数据结构.索引的作用:便于查询和排序(所以添加索引会 ...