一般我们通过box-shadow来设置盒阴影,但是有些属性我们一般没有用到,这篇文章将对box-shadow属性进行逐个分析。
语法

CSS Code复制内容到剪贴板
E {box-shadow:inset x-offset y-offset blur-radius spread-radius color}

  

即:

对象选择器 {box-shadow:投影方式 X轴偏移量 Y轴偏移量 阴影模糊半径 阴影扩展半径 阴影颜色}

inset 投影方式
    此参数是一个可选值,如果不设值,其默认的投影方式是外阴影;如果取其唯一值“inset”, 其投影就是内阴影;
    x-offset
    水平方向的偏移量;
    y-offset
    垂直方向的偏移量;
    blur-radius模糊半径
    可选,只能为整数,值越大阴影就越模糊;
    spead-radius扩展半径
    可选,可以为正数或者负数,如果为负数,整个阴影将会缩小;
    color阴影颜色
    可选,如果不设定值,浏览器将会采用其默认色,默认色一般是黑色。

一般我们很少用到inset和spead-radius这两个属性,如果运用好这两个属性可以制作出非常酷炫的效果。

CSS3中box-shadow的用法介绍的更多相关文章

  1. css3中font-face属性的用法详解

    @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,我们在Web的开发中使用字体不怕只能使用Web安全字体,你们当中或许有许 ...

  2. CSS3中transform属性的用法

    有时候网站也要愚弄一下访客,比如愚人节.下面我给大家推荐个效果,就是整个页面左右颠倒了.css3 很强大,简单的几行代码就可以帮我们实现这个效果. view source   print? 01 &l ...

  3. html5+css3中的background: -moz-linear-gradient 用法

    在CSS中background: -moz-linear-gradient 让网站背景渐变的属性,目前火狐3.6以上版本和google浏览器支持这个属性. background: -moz-linea ...

  4. html5+css3中的background: -moz-linear-gradient 用法 (转载)

    转载至-->http://www.cnblogs.com/smile-ls/archive/2013/06/03/3115599.html 在CSS中background: -moz-linea ...

  5. SqlHelper中SqlHelperParameterCache类的用法介绍

    SqlHelper类中提供了三种可以用来管理SqlParameter参数的共享方法.下面来一一讲解: 1.CacheParameterSet 将SqlParameter参数数组存储到本地缓存中 2.G ...

  6. Java中的Enum(枚举)用法介绍

    1. 关于Java Enum:学过C/C++等语言的人,应该都对Enum类型略知一二.Enum一般用来表示一组相同类型的常量.如性别.日期.月份.颜色等.对这些属性用常量的好处是显而易见的,不仅可以保 ...

  7. SVN中tag branch trunk用法详解

    SVN中tag branch trunk用法详解 2010-05-24 18:32 佚名 字号:T | T 本文向大家简单介绍一下SVN中tag branch trunk用法,SVN中tag bran ...

  8. 不可不看!CSS3中三十一种选择器用法

    原文 The 30 CSS Selectors you Must Memorize 由 Jeffrey Way 发表于 2012 年 6 月,介绍了 30 种最常用的 CSS 选择器用法,多加了一种, ...

  9. css3中user-select的用法详解

    css3中user-select的用法详解 user-select属性是css3新增的属性,用于设置用户是否能够选中文本.可用于除替换元素外的所有元素,以下是user-select的主要用法和注意事项 ...

  10. Spring Data JPA系列3:JPA项目中核心场景与进阶用法介绍

    大家好,又见面了. 到这里呢,已经是本SpringData JPA系列文档的第三篇了,先来回顾下前面两篇: 在第1篇<Spring Data JPA系列1:JDBC.ORM.JPA.Spring ...

随机推荐

  1. SQL Server :DBLINK创建及使用

    Exec sp_droplinkedsrvlogin bvtwfld12,Null --若存在先刪除Exec sp_dropserver bvtwfld12EXEC sp_addlinkedserve ...

  2. ADO.NET(很精彩全面)

    记录一下地址方便以后看http://www.cnblogs.com/liuhaorain/archive/2012/02/06/2340409.html

  3. 深入浅出MongoDB(三)环境搭建

    上次的博文深入浅出MongoDB(二)概述中我们已经将MongoDB的相关概念讲解了一下,接下来我们继续进行MongoDB学习.在学习之前,大家首先需要在自己的电脑上安装MongoDB. 1.安装 安 ...

  4. mac下,利用homebrew安装PHP+Mysql+Nginx

    具体可以参考直通车 http://blog.frd.mn/install-nginx-php-fpm-mysql-and-phpmyadmin-on-os-x-mavericks-using-home ...

  5. asp.net实现md5加密方法详解

    MD5加密简单的说就是把一段明文 通过某种运算方式 求出密文. 例如:明文为:abcdefg 通过一些列运算 得到 密文 7ac66c0f148de9519b8bd264312c4d64 它具有两个特 ...

  6. php输出utf-8格式

    header("Content-type:text/html;charset=utf-8"); 输出数据前插入以上代码,以utf-8格式输出,避免乱码

  7. Python基础 第二天

    1.http://www.cnblogs.com/beer/p/5672678.html requests和beautifulsoup

  8. C/C++ 对常见字符串库函数的实现

    在c中的string.h头文件中存在很多对字符串进行操作的函数,利用这些函数可以方便的对字符串进行操作.下面将对常见的字符串函数进行解释和实现. strcpy 函数原型:char* _strcpy(c ...

  9. 使用ViewSwitcher和ViewFlipper在不同布局中切换

    xml布局: <?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:androi ...

  10. jira插件带ui界面和几种方式

    http://localhost:2990/jira/plugins/servlet/issuecrud jira插件带ui界面和几种方式 https://developer.atlassian.co ...