第1个值水平偏移值

第2个值垂直偏移值

第3个值设置对象的阴影模糊值

第4个值设置对象的阴影外延值

  • 外阴影常规效果
    box-shadow:5px 5px rgba(0,0,0,.6);
  • 外阴影模糊效果
    box-shadow:5px 5px 5px rgba(0,0,0,.6);
  • 外阴影模糊外延效果
    box-shadow:5px 5px 5px 10px rgba(0,0,0,.6);
  • 内阴影效果
    box-shadow:2px 2px 5px 1px rgba(0,0,0,.6) inset;
  • 外阴影模糊效果
    box-shadow:5px 5px 5px rgba(0,0,0,.6);

css3 box-shadow 用法的更多相关文章

  1. CSS3的@keyframes用法详解:

    CSS3的@keyframes用法详解:此属性与animation属性是密切相关的,关于animation属性可以参阅CSS3的animation属性用法详解一章节. 一.基本知识:keyframes ...

  2. css基础之 font的简写规则 以及 自定义 CSS3 @font-face详细用法

    Part 1 font简写 CSS的命名规则是用英文字母 数字 和下划线(一般用小写)来命名.简写css font的好处有三:一是写起来方便(就像键盘快捷键):二是简化代码:三是帮助你熟悉和深刻理解c ...

  3. css3 calc()的用法

    转载自:css3 calc()的用法 说明:calc(四则运算):任何长度值都可以使用calc()函数进行计算:和平时的加减乘除优先顺序一样一样的: 特别注意:calc()里面的运算符必须前后都留一个 ...

  4. 前端CSS3动画animation用法

    前端CSS3动画animation用法 学习如下动画属性 @keyframes animation-name animation-duration animation-delay animation- ...

  5. css3 box

    一.box-shadow介绍 box-shadow属性向box添加一个或多个阴影. 语法: box-shadow: offset-x offset-y blur spread color inset; ...

  6. 浅谈 css3 box盒子模型以及box-flex的使用

    display:box;box-flex是css3新添加的盒子模型属性,它的出现可以解决我们通过N多结构.css实现的布局方式.经典的一个布局应用就是布局的垂直等高.水平均分.按比例划分.   一.使 ...

  7. CSS3的filter用法

    最近到处看到有人在说CSS3的filter一直没有时间自己去测试这效果.今天终于抽出时间学习这个CSS3的Filter.不整不知道呀,一整才让我感到吃惊,太强大了.大家先来看个效果吧: 我想光看上面的 ...

  8. CSS3的基础用法

    CSS3的现状:1.浏览器支持程度差,需要添加私有前缀 2.移动端支持优于PC端 3.不断改进中 4.应用相对广泛 在CSS3中增加新增了许多灵活查找元素的方法,极大的提高了查找元素的效率和精准度.C ...

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

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

  10. CSS3 @font-face详细用法（转）

      @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,我们在Web的开发中使用字体就不用再为只能使用Web安全字体烦恼了! ...

随机推荐

  1. Solr之缓存篇

    原文出自:http://my.oschina.net/u/1026644/blog/123957 Solr在Lucene之上开发了很多Cache功能,从目前提供的Cache类型有: (1)filter ...

  2. css 层叠式样式表（3）

    样式分类 大小 -- 调整div大小,长 width,高 height.长可以直接100%横向沾满屏幕,高不可以. 背景 background-color  背景色 background-image ...

  3. 简单的jQuery前端验证码校验

    简单的jQuery前端验证码校验2 html; <!DOCTYPE html> <html lang="zh-cn"> <head> <m ...

  4. 面试题:struts 拦截器和过滤器

    拦截器和过滤器的区别 过滤器是servlet规范中的一部分,任何java web工程都可以使用. 拦截器是struts2框架自己的,只有使用了struts2框架的工程才能用. 过滤器在url-patt ...

  5. python的argparse模块

    一.简介: argparse是python用于解析命令行参数和选项的标准模块,用于代替已经过时的optparse模块.argparse模块的作用是用于解析命令行参数,例如python parseTes ...

  6. p4301 [CQOI2013]新Nim游戏

    传送门 分析 通过nim游戏我们可以知道我们现在的任务就是通过两轮之后使得剩余的几堆异或和为非0数 所以我们只需要在第一步使得剩余集合的任意非空子集的异或和非0即可 于是我们考虑线性基 我们知道线性基 ...

  7. Linux脚本设计4——一些实用程序

    实用程序1:列目录 #!/bin/bash path=`echo $PATH | sed 's/:/ /g'` for d in $path do echo $d done 这是一个for循环,注意p ...

  8. WebGoat系列实验Cross-Site Scripting (XSS)

    WebGoat系列实验Cross-Site Scripting (XSS) PhishingTitle 本次实验是在一个已知存在XSS漏洞的页面进行钓鱼攻击.通过使用XSS与HTML注入,在页面中注入 ...

  9. loj #2143. 「SHOI2017」组合数问题

    #2143. 「SHOI2017」组合数问题   题目描述 组合数 Cnm\mathrm{C}_n^mC​n​m​​ 表示的是从 nnn 个互不相同的物品中选出 mmm 个物品的方案数.举个例子, 从 ...

  10. 数据结构4:顺序表(线性表的顺序存储结构)及C语言实现

    逻辑结构上呈线性分布的数据元素在实际的物理存储结构中也同样相互之间紧挨着,这种存储结构称为线性表的顺序存储结构. 也就是说,逻辑上具有线性关系的数据按照前后的次序全部存储在一整块连续的内存空间中,之间 ...