css3边框阴影效果
下面来说下css3阴影的语法:
box-shadow:none | <shadow> [ , <shadow> ]*
<shadow> = inset? && [ <length>{2,4} && <color>? ]
取值:
none: 无阴影
<length>①: 第1个长度值用来设置对象的阴影水平偏移值。可以为负值
<length>②: 第2个长度值用来设置对象的阴影垂直偏移值。可以为负值
<length>③: 如果提供了第3个长度值则用来设置对象的阴影模糊值。不允许负值
<length>④: 如果提供了第4个长度值则用来设置对象的阴影外延值。可以为负值
<color>: 设置对象的阴影的颜色。
inset: 设置对象的阴影类型为内阴影。该值为空时,则对象的阴影类型为外阴影
下面来看看语法中的内阴影是什么效果,修改源码:
- div{width:300px; height:100px;border:1px solid #2cb7fe;text-align:center;
- -webkit-box-shadow:3px 3px 10px #9edeff inset;box-shadow:3px 3px 10px #9edeff inset;
-webkit-box-shadow:0px 0px 6px #e36e73;
-moz-box-shadow:0px 0px 6px #e36e73;
box-shadow: 0px 0px 6px #e36e73;
css3边框阴影效果的更多相关文章
- css3 边框阴影效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- HTML 学习笔记 CSS3 (边框)
CSS3边框 通过CSS3边框 你能够创建远角边框 向矩形边框添加阴影 使用图片来绘制边框 . CSS3的边框属性 主要包含以下几种 border-radius 边框圆角 box-shadow 边框阴 ...
- css3 边框记
css3 边框 border属性在css1中就已经定义了,使用它可以设置元素的边框风格,边框颜色以及边框粗细. border-width:设置元素边框的粗细. border-color:设置元素边框的 ...
- css3 边框、背景、文本效果
浅玩CSS3 边框.背景.文本效果 一.边框 box-shadow box-shadow: h-shadow v-shadow blur spread color inset(ontset); //h ...
- [HTML] CSS3 边框
CSS3 边框 用CSS3,你可以创建圆角边框,添加阴影框,并作为边界的形象而不使用设计程序,如Photoshop. 在本章中,您将了解以下的边框属性: border-radius box-shado ...
- CSS3边框温故
1.简介:border属性在CSS1中就已经定义了,用来设置元素边框风格,设置不同的边框.颜色.粗细 2.基本属性,包括三个类型值:(1)border-width:设置元素边框的粗细,默认3~4px( ...
- C# 无边框窗体边框阴影效果
通过下面代码在构造函数中调用方法 SetShadow(); 即可实现无边框窗体的阴影效果了 需要添加命名空间 using System.Runtime.InteropServices; private ...
- C#窗体四边框阴影效果的实现
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- CSS3 边框
说明:CSS3完全向后兼容,因此不必改变现有的设计.浏览器通常支持CSS2 CSS3模块 CSS3被划分为模块: 选择器 框模型 背景和边框 文本效果 2D/3D 转换 动画 多列布局 用户界面 CS ...
随机推荐
- 全文检索引擎 sphinx-coreseek中文索引
Sphinx是一个基于SQL的全文检索引擎,可以结合MySQL,PostgreSQL做全文搜索,它可以提供比数据库本身更专业的搜索功能,使得应用程序更容易实现专业化的全文检索. Sphinx特别为一些 ...
- Scala基本语法总结(一)
Scala基本语法总结 时隔快一年了,又捡起scala,不是想学的有多么的精通,只是想把之前遇到的知识点和实践中遇到的重点进行归纳总结,对以后的面试或许有点帮助吧! 一.scala开发环境的配置 我这 ...
- sas的使用
1.建表 /*************************************/ /* create the second input data set */ /*************** ...
- Java面向对象之抽象方法&接口
在开始写抽象类之前,有一个问题我觉得想清楚会对理解抽象类很有帮助:那就是为什么要设计抽象类? 难道用类还不够么,为什么要设计出抽象类这样一个东西.我们可以换个角度来理解,就是有些类本来就是不应该被实例 ...
- poj2676 (dfs+回溯)
Sudoku Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 24108 Accepted: 11259 Specia ...
- 人脸检测库libfacedetection介绍
libfacedetection是于仕琪老师放到GitHub上的二进制库,没有源码,它的License是MIT,可以商用.目前只提供了windows 32和64位的release动态库,主页为http ...
- Android:Gradle报错——No resource found that matches the given name (at 'dialogCornerRadius' with value '?android:attr/dialogCornerRadius')
今天在使用科大讯飞语音识别SDK进行语音识别功能实现时,莫名的引入了这个错误.不得不吐槽Android Studio再引入别的包时太容易出现冲突,然后导致无法找到R文件,项目无法执行. 1. 具体报错 ...
- JS日期转换
用js将从后台得到的时间戳(毫秒数)转换为想要的日期格式 得到后台从数据库中拿到的数据我们希望格式是 2016年10月25日 17时37分30秒 或者 2016/10/25 17:37:30 然而我们 ...
- linux_fdisk命令详解,关于分区的详解
这篇文章写的十分详细,特别的好 fdisk -l 可以列出所有的分区,包括没有挂上的分区和usb设备.我一般用这个来查找需要挂载的分区的位置,比如挂上u盘. 实例解说Linux中fdisk分区使用方法 ...
- 「专题训练」Machine Schedule(HDU-1150)
题意 在一个工厂,有两台机器\(A, B\)生产产品.\(A\)机器有\(n\)种工作模式(模式\(0\),模式\(1\)--模式\(n-1\)).\(B\)机器有\(m\)种工作模式(模式\(0\) ...