Css3背景<background>Css3包含多个新的背景属性，它们提供了对背景更强大的控制。可以自定义背景图的大小，可以规定背景图片的定位区域，css3还允许我们为元素使用多个背景图像属性描述CssBackground-image规定背景的背景图2Background-position规定背景的定位2Background-repeat规定背景的重复方式2Background-color规定背景的颜色2Background-clip规定背景的绘制区域3Background-origin规定背景图片的定位区域3Background-size规...
background-color: 指定填充背景的颜色。 background-image: 引用图片作为背景。 background-position: 指定元素背景图片的位置。 background-repeat: 决定是否重复背景图片。 background-attachment: 决定背景图是否随页面滚动。背景的简写属性：background: <color> <image> <position> <attachment> <repeat>css3属性：背景修剪(background-clip)背景原点(background-origin)背景尺寸(background-size)原文：http://my.oschina....
HTML5 CSS3银河系星空闪耀网页背景动画特效，运行本效果后，一幅像银河系的星空图展现眼前，远处星空闪耀，星空整体上同样也具有动画效果，可很好的应用于网页背景中，本背景动画的生成依赖Canvas技术，运行时请选择支持Canvas技术的浏览器，IE就免谈了，推荐Chrome。提示：若不能运行，请将代码保存到本地HTML文件中，然后使用Chrome打开。 【源代码展示】<!doctype html><html><head><meta charset="utf-8"><title>HTML5 Canvas全...
table th {border:1px solid #CCCCCC;background-color:#FFFFFF;FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#C3DAF5); /*IE6-IE8*/background: -ms-linear-gradient(top, #fff, #C3DAF5); /* IE 10 */background:-moz-linear-gradient(top, #fff,#C3DAF5);/*火狐*/ background:-webkit-gradient(linear, 0% 0%, 0% 100%,from(#fff), to(#C3DAF5));/*谷歌*/ ...
1 <body>2 <ul id="list">3 <li>11</li>4 <li></li>5 <li></li>6 <li></li>7 <li></li>8 <li></li>9 <li></li> 10 <li></li> 11 <li id="last" class="last"></li> 12 </ul> 13 <script> 14var li=document.getElementsByTagName(‘li‘); 15for(var i=0;i<li.length;i++){ 16 li[i].addEventListener(‘mouseover‘,function () { 17this.style.background=‘red‘; 18 }); 1...
---------颜色表示方法background: --1) red -- 英文单词2) #ff0000 -- 16进制3) rgb(255,0,0) --3元色4) rgb(100%, 0%, 0%) --百分比---------背景图片起始位置background-origin: padding-box / border-box / content-box;图片边框起始 内边距起始 内容起始---------背景色起始位置background-clip: boder-box / padding-box / content-box;边框起始 内边距起始 内容起始例: 如背景色黄色 边框起始 边框边框也为黄---------...
DIV+CSS中让布局居中_背景图片居中_文字内容居中原文：http://www.cnblogs.com/as3lib/p/4466282.html
Firefox浏览器下的渐变背景 Firefox3.6background:-moz-linear-gradient(top, red, rgba(0, 0, 255, 0.5));chrome/Safari浏览器下的渐变背景实现 Safari4background:-webkit-gradient(linear, 0 0, 0 bottom, from(#ff0000), to(rgba(0, 0, 255, 0.5)));综合 – 兼容性的渐变背景效果filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) progid:DXImageTransform.Microsoft.gradient(...
项目的需要，需要一个背景半透明的效果，于是马上想到“opacity:0.5″等等，为兼容IE可能还会用到filter,如:filter:alpha(opacity=50);-moz-opacity:0.50;opacity:0.50;上面的是可以达到半透明的效果，但是会影响里面的子元素也半透明，例如DIV里面的文字也半透明了，这不是我想要的如下，实现了可以兼容各浏览器，达到背景颜色半透明而不影响子元素的代码：background:rgba(0,0,0,0.6)background: transparent\9;zoom:1\8;/* requ...
在DIV CSS布局的页面里，从布局内容到页面里文章文字居中都是非常重要的，而css来设置居中也是非常简单的。 1、首先介绍使用css属性让整体布局的居中： 设置对象的父级内容居中，这里一个页面的为父级是什么呢？我们可以想象整个页面的内容是由<html></html>和<body></body>这两个包含，那根据较近父级我们就设置body的CSS来实现居中问题，可以向在内容里居中有text-align:center;具体css的居中代码为： body{text-aligh:...
?背景透明文字不透明<!DOCTYPE html> <html> <head><meta charset="utf-8"><title>背景透明，文字不透明</title><style>* {padding: 0;margin: 0;}body {padding: 50px;background: url(1.jpg) 0 0 repeat;}.demo {padding: 25px;background-color: rgba(0, 0, 0, 0.5); /* IE9、标准浏览器、IE6和部分IE7内核的浏览器(如QQ浏览器)会读懂 */}.demo p {color: #FFFFFF;}@media \0screen\,screen\9 {/* 只支持IE6、7、8 */.demo {bac...
一个简单地额记录 .btn{background:url(images/phone.gif);background-repeat:no-repeat;background-position:-63px -40px;height:20px;width:20px;text-align:center;float:left;border:0;} 原文：http://www.cnblogs.com/mc67/p/5227322.html
效果截图： 实现代码： 复制代码代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title></title> <style type="text/css"> .linear{ width:100%; height:600px; FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=##15A216,endColorStr=#fafafa); /*IE*/ background:-moz-linear-gradient...
复制代码代码如下:html,body { margin:0; padding:0; height:100%; font-family:"Times New Roman" /**/ background:url(images2/bg2m.jpg); }原文：http://www.jb51.net/css/110342.html
给我一个渐变的效果鼠标移入能看到效果<!DOCTYPE html><html><head><meta charset="utf-8"><title></title><style type="text/css">.d1{width: 200px;height: 200px;background: green;position: relative;overflow: hidden;} .d2{width: 200px;height: 200px;z-index: 1;position: absolute;} .d2:before{content: "";position: absolute;width: 100%;height: 100%;top: 100%;background: red;z-index: -2;transition: all 0.5...