box-shadow介绍

css3可以使用 box-shadow 属性轻松地为元素添加阴影效果,box-shadow可以设定多组效果,每组参数值以逗号分隔.

语法:

box-shadow:x-shadow  y-shadow  blur  spread  color  inset;

参数说明:

  • x-shadow:设置对象的阴影水平偏移值,单位可以是px、em或百分比等,允许负值。
  • y-shadow:设置对象的阴影垂直偏移值,单位可以是px、em或百分比等,允许负值。
  • blur:用于设置边框阴影半径大小。
  • spread:扩展半径,设置阴影的尺寸;这个参数可选,缺省时值为0。
  • color:设置阴影的颜色;
  • inset:这个参数默认不设置。默认情况下为外阴影,inset表示内阴影。

彩色阴影:

box-shadow:0px 0px 10px red,2px 2px 10px 10px yellow,4px 4px 12px 12px green;

C#-WebForm-css box-shadow 给边框添加阴影效果的更多相关文章

  1. 【uniapp 开发】如何给边框添加阴影效果

    css的box-shadow是用来添加边框阴影效果的. 属性值详解: 1.inset 可选值,默认阴影在盒子外 使用inset后,阴影在盒子内,即使指定边框或者透明边框,阴影依然存在. 2. 这是头两 ...

  2. swift UIButton边框添加阴影效果

    btn.layer.shadowOpacity = 0.8 //阴影区域透明度 btn.layer.shadowColor = UIColor.black.cgColor // 阴影区域颜色 btn. ...

  3. CSS Box Model(盒子模型)

    CSS Box Model(盒子模型) 一.简介 所有HTML元素可以看作盒子,在CSS中,"box model"这一术语是用来设计和布局时使用. CSS盒模型本质上是一个盒子,封 ...

  4. CSS -- 盒子模型之边框、内边距、外边距

    一.使用border为盒子添加边框 盒子模型的边框就是围绕着内容及补白的线,这条线你可以设置它的粗细.样式和颜色(边框三个属性). 1.border-style(边框样式)常见样式有: dashed( ...

  5. css盒子模型之边框

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

  6. 纯css竟可以做出边框这样长宽度的过渡效果

    边框效果如下:鼠标移到下面方形,就有效果   要是没有效果,点这个:https://murenziwei.github.io/testGit/Untitled1.html 正如你所看到的,这边框颜色只 ...

  7. CSS 关于文本 背景 边框整理

    文本与字体 1)阴影:text-shadow 格式:text-shadow:5px 5px 3px #FFFFFF分别对应 水平方向 垂直方向 模糊程度 颜色值 代码: <!DOCTYPE ht ...

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

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

  9. 前端自动化(三) 合并压缩css、压缩js、添加时间戳、打包上线操作

    前端自动化(三)   合并压缩css.压缩js.添加时间戳.打包上线操作 此文在前两篇基础上对比参考,会很方便理解 gulp.task("delete",function(){ r ...

随机推荐

  1. 把二叉搜索树转化成更大的树 · Convert BST to Greater Tree

    [抄题]: 给定二叉搜索树(BST),将其转换为更大的树,使原始BST上每个节点的值都更改为在原始树中大于等于该节点值的节点值之和(包括该节点). Given a binary search Tree ...

  2. 阿里云EIP按流量计费

    https://help.aliyun.com/document_detail/27767.html 计费周期为1小时,账单周期也为1小时.在一个计费周期内,如果您使用的时间不足一小时,按一小时收费. ...

  3. Create Empty Project In Vs But Not Debug?

    问题描述 在使用VS创建一个空的项目管理,然后,添加项目.可是,这个时候,项目虽然可以运行,但是不能Debug进行调试. 解决方法 按照下面三张图像的设置即可.

  4. 多因子降维法(MDR,Multifactor Dimensionality Reduction )

    多因子降维法(MDR,multifactor dimensionality reduction)   多因子降维法(MDR,Multifactor Dimensionality Reduction ) ...

  5. Luogu 4449 于神之怒加强版

    挺套路的题,然而一开始还是想错了…… $\sum_{i = 1}^{n}\sum_{j = 1}^{m}gcd(i, j) ^ {k} = \sum_{T = 1}^{min(n, m)}\left ...

  6. VMware workstation 语言包切换

    VMware-workstation-full-10.0.2-1744117安装默认为中文版,如果要使用英文版做如下操作: 找到你的VMware安装目录:例如:D:\Program Files (x8 ...

  7. ajax 测试

    在学习SpringMVC的过程中,接触到ajax,顺便复习一下前面学习到的知识! 这篇博客中讲的比较详细 http://www.cnblogs.com/lsnproj/archive/2012/02/ ...

  8. VC++中MessageBox的常见用法详解

    消息框是个很常用的控件,属性比较多,本文列出了它的一些常用方法,及指出了它的一些应用场合.         1.MessageBox("这是一个最简单的消息框!");        ...

  9. Oracle电子商务套件版本12.1.3自述文件 (Doc ID 1534411.1)

    文档内容 用途 适用范围 详细信息   应用版本更新包   更新后的步骤   包含的修补程序列表   变更记录   文档可访问性 参考 适用于: Oracle Applications DBA - 版 ...

  10. PG数据库错误: 检测到OA幸运飞艇源码ShareLock死锁处理

    PostgreSQL 是一个免费数据库,OA幸运飞艇源码下载,详情咨询[企娥166848365]对于处理分析型+交易型混合型系统来说确实很不错,特别是版本的升级到11.2后性能提升很多,很多运行机制跟 ...