说明

box-shadow 属性可以给元素边框周围添加一个或者多个阴影效果。定义多个阴影，使用逗号分隔。

语法

box-shadow: none | [inset? && [<offset-x> <offset-y> <blur-radius>? <spread-radius>? && <color>? ] ]

解释

none：默认值为none，表示没有阴影
inset：可选。将边框外阴影改为边框内阴影（即使是透明边框），背景之上内容之下。如果不写，默认为边框外阴影。inset只可写在最前或者最后。
offset-x：必需。阴影水平方向的偏移量。 0，表示阴影在元素后面；正值，表示阴影在元素右边

CSS3 box-shadow 内外阴影效果的更多相关文章

  1. css3 box

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

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

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

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

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

  4. css3 Box model 与 Box-sizing

    1.Box Model(盒模型) CSS中的Box Model分为两种:第一种是W3C的标准模型,另一种是IE的传统模型.它们的相同之处是对元素的width.height.padding.border ...

  5. 分享div、text、Box Shadow(阴影)演示及代码的页面

    附图: 直接上链接:www.css88.com/tool/css3Preview/Box-Shadow.html

  6. 【转载】css3 content 生成内容

    content一般和:before,:after一起使用,用来生成内容(img和input没有该属性),content的内容一般可以为以下四种: none: 不生成任何值. attr: 插入标签属性值 ...

  7. 一款基于的jQuery仿苹果样式焦点图插件

    这次我们要分享的这款jQuery焦点图非常特别,它的外观特别简单,但是又相当大气.焦点图的整体样式是仿苹果样式的,由于jQuery的运用,我们只要点击图片下方的缩略图即可达到图片切换的焦点图特效,这款 ...

  8. HTML5 拖放：在相册中对照片进行排序

    1. [代码]index.html     <div class="albums">    <div class="album" id=&qu ...

  9. css3 shadow为了实现各种漂亮的阴影效果

    <!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/h ...

随机推荐

  1. web前端工程师全套教程免费分享

    这是我自己早前听课时整理的前端全套知识点,适用于初学者,也可以适用于中级的程序员,你们可以下载下来.我自认为还是比较系统全面的,可以抵得上市场上90%的学习资料.讨厌那些随便乱写的资料还有拿出来卖钱的 ...

  2. Linux 源码编译Python 3.6

    Linux 源码编译Python 3.6 1.操作系统以及版本显示 # uname -sr Linux 3.10.0-514.el7.x86_64 # uname -sr Linux 3.10.0-5 ...

  3. 基于winsocket的框体Server和Client

    前面学了一点Winsock的知识,会编写简单的Server和Client,现在就想通过VS2008编写框体的Server和Client,而不是在控制台上的操作了,毕竟学编程就是要多加练习,在实践中发现 ...

  4. Linux系统安装_Centos6.9

    第1章 虚拟机安装  1.1 镜像下载 1.1.1 新版本下载 http://mirrors.aliyun.com  #阿里云官方镜像站点 1.1.2 旧版本下载 http://vault.cento ...

  5. Hibernate的基础入门(一)

    一Java三层结构 1 web层:struts框架 2 service层:Spring框架 3  dao层 :hibernate框架 相当于MVC的思想 1 M:模型èhibernate框架 2 V: ...

  6. AngularJS学习篇（十三）

    AngularJS HTML DOM ng-disabled 指令 ng-disabled 指令直接绑定应用程序数据到 HTML 的 disabled 属性. <!DOCTYPE html> ...

  7. SeaJS之shim插件:解决非cmd规范的插件与sea的区别

    SeaJS 中的模块默认都遵守 CMD 规范,但现实中已存在大量普通 JavaScript 类库,比如 jQuery.Underscore 等.使用 shim 插件,可以将这些普通 JS 文件转换成 ...

  8. ⒂bootstrap组件 折叠 基础案例

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. 图文详解linux/windows mysql忘记root密码解决方案

    经常有用户过来咨询说自己的mysql服务器忘记密码了怎么办,为了更好的解决大家的困扰,本文特归档整理了windows和linux系统下,mysql忘记密码的解决方案.本文内容是我亲测实用,当然过程中踩 ...

  10. 阿里云centos配置postfix

    1. 为了防止垃圾邮件,先到域名控制面板设置好. MX A 记录及TXT记录 其中TXT记录如下  @  spf1 a mx ~all 意思就是使用spf1协议,允许a记录和MX记录对应的IP,不允许 ...