要绝对定位,而且需要设置z-index,垂直高度,数值越小越看不见。

<div class="beauty">I am your girl~</div>
<div class="beauty b1"></div>
<div class="beauty b2"></div>

HTML

.beauty {
width: 250px;
height: 250px;
position: absolute;
background: purple;
z-index:;
color: white;
text-align: center;
}
.b1 {
left: 20px;
top: 20px;
background: yellow;
z-index: -1;
}
.b2 {
left: 30px;
top: 30px;
background: red;
z-index: -2;
}

CSS

(*^__^*) :

一个多重阴影的DIV框框的更多相关文章

  1. 用CSS画一个带阴影的三角形的示例代码

    1. 思路 怎么用CSS3画一个带阴影的三角形呢 ? 有童鞋说, 这还不简单吗 网上有很多解决方案, 但其实大多都是实现不太完美的, 存在一些问题 假设我们做一个向下的三角形箭头 常见的方法大致有两种 ...

  2. canvas多重阴影发光效果

    canvas多重阴影发光效果 前言 在一个项目中,客户提了一个发光的效果,效果图如下: 阴影 有的人可能会说,这个用阴影其实就可以实现.但是从图中可以看出,是一个比较强烈的发光效果.实际的应用过程中我 ...

  3. Jquery一个slideToggle搞定div的隐藏与显示

    Jquery一个slideToggle搞定div的隐藏与显示 <!DOCTYPE html> <html> <head> <script src=" ...

  4. QT模态对话框用法(在UI文件中设置Widget背景图,这个图是一个带阴影边框的图片——酷)

    QT弹出模态对话框做法: 1.新建UI文件时,一定要选择基类是QDialog的,我的选择是:Dialog without Buttons(),如下图: 2.然后在使用的时候: MyDialog dlg ...

  5. iphone下元素放在了一个position: fixed的div中无法点击

    网上的说法是这样的: iphone的浏览器有这么一个bug, 当你使用锚定或滚动页面后, 你会发现某些东西不能点击了! 如果你的这个“东西”放在了一个position: fixed的div中, 那么你 ...

  6. div中放入一个img元素导致div高度会多出几个像素

    在写代码的时候经常遇到这样一个问题,如果div里嵌套一个img元素且div的高度是由img的高度来撑开,那么div的高度总会比img的高度多3px.好了,废话不多说,直接给大家上代码. html代码: ...

  7. 一个可拖拽的DIV框框

    http://codepen.io/lrelia/pen/bEyLB 使用了JQuery UI库, draggable来自于JQuery UI库

  8. 一个页面两个div(一个柱状图或者折线图一个饼图)

    需求是一个页面中两个图,一个饼图一个折线图,接口用的是一个接口,柱状图的图例要隐藏掉,X轴为月份,每月份都有两个数据,也就是图例是两个(进口和出口)的意思饼图需要显示最新月份数据,并且有一个下拉框可以 ...

  9. IOS中div contenteditable=true无法输入 fastclick.js在点击一个可输入的div时,ios无法正常唤起输入法键盘

    原文地址: https://blog.csdn.net/u010377383/article/details/79838562 前言 为了提升移动端click的响应速度,使用了fastclick.js ...

随机推荐

  1. Thinking Of Matrix

    http://blog.163.com/bzm_square/blog/static/9355546320129582254842/ PS: 一种有关于矩阵的思维方法.....WiKi 向量空间,不定 ...

  2. 被swoole坑哭的PHP程序员

    被swoole坑哭的PHP程序员 2015-09-16 09:57 文帅营 博客园 字号:T | T 首先说一下对swoole的理解:披着PHP外衣的C程序.很多PHPer朋友看到swoole提供的强 ...

  3. Mac OS X:禁止崩溃报告-CrashReport

    Mac OS X:禁止崩溃报告 崩溃报告就是CrashReport 至于官方的有关CrashReport的文档在Technical Note TN212 . 一般的默认情况下,当一个应用程序因为各种原 ...

  4. TiD大会学习心得之沟通交流

    沟通交流是敏捷成功的关键要素,据相关调查阻碍敏捷的主要原因都与人有关:例如缺乏领导支持.团队缺乏协作精神.公司文化与敏捷相冲突等等:同时沟通交流也是团队建设.教练自身成长的重要支柱.下面结合在< ...

  5. CSS特异性(CSS Specificity)的细节之CSS样式权重的计算与理解(CSS样式覆盖规则)

    本篇讲解CSS特异性(CSS Specificity)的细节,也就是CSS样式选择器的权重计算 通过计算选择器的权重(weight)最终决定哪个选择器将获得优先权去覆盖其他选择器的样式设定,即“优先原 ...

  6. "undefined method `root' for nil:NilClass" error when using "pod install" 解决办法

    如果pod undate 的时候报错"undefined method `root' for nil:NilClass" error when using "pod in ...

  7. 网络服务器之HTTPS服务

    import ssl, socket, time if __name__ == "__main__": context = ssl.SSLContext(ssl.PROTOCOL_ ...

  8. C#实现对远程服务器的内存和CPU监控

    C#实现对远程服务器的内存和CPU监控小记 1.  主要使用到的组件有System.Management.dll 2.  主要类为 :ManagementScope 连接远程服务器示例代码: priv ...

  9. ceph network introduce

    网络结构 Ceph 使用以太网连接内部各存储节点以及连接 client 和集群.Ceph 推荐使用两个网络: 前端(北向)网络( a public (front-side) network):连接客户 ...

  10. css ul li 横向排列

    因为li是块级元素,默认占一行的,要想实现横向排列,一般通过以下两个方法:float:left这样设置有一个问题,li浮动以后则脱离了文本流,即不占位置,如果它的父级元素有具体的样式且没有固定宽高,建 ...