div阴影

  1. .box-shadow{
  2. //Firefox4.0-
  3. -moz-box-shadow:投影方式 X轴偏移量 Y轴偏移量阴影模糊半径 阴影扩展半径 阴影颜色;
  4. //Safariand Google chrome10.0-
  5. -webkit-box-shadow:投影方式 X轴偏移量 Y轴偏移量阴影模糊半径 阴影扩展半径 阴影颜色;
  6. //Firefox4.0+、 Google chrome 10.0+ 、 Oprea10.5+ and IE9
  7. box-shadow:  投影方式 X轴偏移量 Y轴偏移量 阴影模糊半径 阴影扩展半径 阴影颜色;
  8. }
时间: 2024-08-07 11:36:59

div阴影的相关文章

CSs阴影框,Div阴影

<!DOCTYPE HTML><html><head><meta charset="UTF-8"><title>CSs阴影框,Div阴影</title><style type="text/css">*{ margin:0; padding:0; border:0; }body{ padding:4em; font-family:Tahoma, Geneva, sans-serif }

css3实现小黄人

效果就像这样: 不废话,直接上代码! hrml代码: <!DOCTYPE html> <html> <head lang="zh"> <meta charset="UTF-8"> <title>纯CSS3画出小黄人并实现动画效果</title> <Link href="index.css" type="text/css" rel="styl

box-shadow和flex布局的应用

昨天拿到设计稿后,发现设计师设计的边框阴影比较特别,我平常没有接触过. 所以一开始我是直接切图和把边框当做背景来使用.等把页面全部做来后,我在网上搜了box-shadow相关方面的文章,发现还是有很多牛人总结了.下面就是我学习后的结果. <div class="fans"> <ul class="fans-ul"> <li> <img class="lazy" src="img/fans_1.j

css兼容性

1.div阴影的兼容 <style type="text/css">.mydiv{width:220px;height:auto;padding:5px;border:#909090 1px solid;background:#fff;color:#333;filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);/*ie*/-moz-box-shadow:

css box-shadow详细讲解(包含IE兼容)

上一节我们一起探讨了一下CSS3的文字阴影text-shadow的使用方法,今天我们接着一起来探讨一下CSS3中的另一个属性box-shadow的使用方法.CSS3的box-shadow有点类似于text-shadow,只不过不同的是text-shadow是对象的文本设置阴影,而box-shadow是给对象实现图层阴影效果. 本文我们搁下IE不谈,只谈谈box-shadow的具体使用方法 如果想让上方的div阴影遮挡下方的div  那么,把上方的div中设置position:relative即可

一个css3按钮练习

RunJS地址:http://runjs.cn/detail/vnhi5yuw 在本次的练习中,css分析如下 .button{ text-transform:uppercase;//转为大写 text-align:center;//文字水平垂直居中 line-height:37px; vertical-align:middle; font-family:Arial;//字体 -webkit-text-stroke:1px #444;//字体镂空 height:35px; width:140px

CSS3样式归纳

1.CSS3边框设置 通过 CSS3,可以创建圆角边框和向div添加阴影 div{ border:2px solid; border-radius:25px;//改变div边框四个角的弧度 border-shadow:5px 5px 2px #999;//div阴影样式 }

CSS相对定位实现DIV层的投影(阴影)效果

<html> <head> <title>DIV层阴影</title> <style> .out { position:relative; background:#E4E4E4; margin:8px auto; width:300px } .in { background:#fff; border:1px solid #666; padding:10px 5px; position:relative; top:-5px; left:-5px;

Div 添加阴影

<style type="text/css">.mydiv{   width:250px;height:auto;border:#909090 1px solid;background:#fff;color:#333;   filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);   -moz-box-shadow: 2px 2px 10px #90909