背景透明:
1、{background:rgba(52, 53, 55, 0.6) none repeat scroll 0 0 !important;/*实现FF背景透明,文字不透明*/ filter:Alpha(opacity=60);background:#fff};
2、{ filter: alpha(opacity=60); opacity: 0.6; };
3、图片做成png-8,各个浏览器支持。
input透明:filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;
固定的背景,随着内容的增多高度增加:
{min-height:900px;height:auto!important;height:900px;};
固定高度,出现滚动条 :
第一层div,固定高度,第二层 div{height:100%;overflow:auto;}
固定宽度,内容自动换行(包括符号,字母自动换行):
{width:100px; word-wrap: break-word; overflow: hidden;}
鼠标变光标:
.mouseright{cursor:url("images/asdfasdfasdf.cur"), pointer;}(注:css样式要写在内部。mouseright与div的类名是同级别的: class="gdc_center mouseright"。)
不设置div元素宽度的情况下,使div居中:
外层元素{text-align:center;} 内层元素{display:inline-block;text-align:left;*display:inline;*zoom:1;}
设置图片居中对齐:
外层元素{display:table-cell;vertical-align:middle;text-align:center;*display: block;*font-size:70px;*font-family:Arial;width:15%;height:50px;} 内层元素(img元素){vertical-align:middle;border:0;}
标签之间有浮动加<br />修改样式:
display:inline-block;不加float:left;
pre标签 换行:
pre{width:530px;white-space:pre-wrap;/* css3.0 */white-space:-moz-pre-wrap;/* Firefox */white-space:-pre-wrap;/* Opera 4-6 */white-space:-o-pre-wrap; /* Opera 7 */word-wrap:break-word;/* Internet Explorer 5.5+ */}
不固定高度,让div垂直居中页面:
最父级div{ width: 100%; height: 100%; background: #fff; display: table; *position: relative; }
次父级div{ display: table-cell; vertical-align: middle; *position: absolute; *top: 50%; }
div{ width: 400px; margin: 0 auto; *position: relative; *top: -50%; }
苹果手机自带样式清除:
-webkit-appearance: none;
css3: animation-name: fadeIn; /*动画名称*/
animation-duration: 1.5s; /*动画持续时间*/
animation-iteration-count: 1; /*动画次数*/
animation-delay: 0.5s; /*延迟时间*/
animation-fill-mode: backwards;
网友评论