要绝对定位,而且需要设置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. html文本的基本设置

    一.字体属性: 选择字体:font-family:value,value....指定字体的显示,按照顺序直到能够匹配 字体的大小:font-size:39px: 字体加粗:font-weight:bo ...

  2. 国家以及国家语言的json数据格式,提供给网友参考。

    目前接触到一个需求,需要全球主要国家的选择以及语言的选择,如下图: 这是国家选项 这是语言的选项: 很简单有木有? 本来打算直接给文件,但是好像没有文件上传,所以就提供一个思路和代码,你们照着弄吧. ...

  3. 开源代码分析之Android/iOS Hybrid JSBridge框架

    Hybrid开发是现在的主流形式,对于业务快速迭代的公司尤其重要.曾将在鞋厂接触了很多关于Hybrid的理念,在这里分享一些Hybrid框架思想. Hybrid框架包括Native与H5的通信,Web ...

  4. Linux下安装性能测试负载机LG

    系统:CentOS release 6.6 (Final)  x86_64 安装包: 1.LRLG_00031.iso [Load Generator Standalone (Linux 64-bit ...

  5. 神奇的 CURL 命令

    CURL? 嗯,说来话长了~~~~ 这东西现在已经是苹果机上内置的命令行工具之一了,可见其魅力之一斑 1) 二话不说,先从这里开始吧! curl http: //www.yahoo.com   回车之 ...

  6. js 获取滚动条的高度 以及 设置滚动条的高度

    //设置窗口滚动条高度 function setScrollTop(top){ if(!isNaN(top))document.body.scrollTop = top; } //取窗口滚动条高度 f ...

  7. VMware安装chrome os遇到选择网络问题.

    在下载下来的vmx文件中添加一行ethernet0.virtualDev = "e1000" 就可以了.参考网站http://communities.vmware.com/thre ...

  8. const

     const int i = 20; int const i = 20; 这两个语句是完全相同的:const与int哪个写在前面都不影响语义. 所以: const int *p; int const ...

  9. 《storm实战-构建大数据实时计算读书笔记》

    自己的思考: 1.接收任务到任务的分发和协调   nimbus.supervisor.zookeeper 2.高容错性                            各个组件都是无状态的,状态 ...

  10. kafka Failed to send messages after 3 tries 问题解决

    kafka Failed to send messages after 3 tries. 在kafka0.8开发过程中 生产者测试用例碰到了 Exception in thread "mai ...