标签:str one sele ant ble 下拉 下拉框 table 文本
透明度
.lucency{
filter:alpha(opacity=80);
opacity:0.3;
}
背景透明度
.lucencyBg{ line-height: 1.5 !important;">transparent; }
1. css hack
1 .pad{ 2 padding:17px 0 0 17px; /* 普通写法 */ 3 *padding:17px 0 0 17px; /* *为IE7 *+html css()为IE7 */ 4 _padding:17px 0 0 17px; /* _为IE6 *html css()为IE6 */ 5 }
2. css 设置圆角
1 .radius{ 2 -moz-border-radius: 100px; 3 -webkit-border-radius: 100px; 4 border-radius:100px; 5 }
3. css 盒子阴影 (x,y,阴影模糊度,阴影颜色)
1 .shadow{ 2 -moz-box-shadow: 3px 3px 4px #fff; 3 -webkit-box-shadow: 3px 3px 4px #fff; 4 box-shadow: 3px 3px 4px #fff; 5 filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=3px, OffY=3px, Color=‘#ffffff‘); /* 盒子阴影 IE6,IE7 */ 6 -ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=3px, OffY=3px, Color=‘#ffffff‘)"; /* 盒子阴影 IE8 */ 7 }
4. css 透明度
1 .lucency{ 2 filter:alpha(opacity=80); 3 opacity:0.8; 4 }
5. css 文本超出范围省略号代替 ( 块级元素,强制单行)
1 .over{ 2 overflow:hidden; 3 white-space:nowrap; 4 text-overflow:ellipsis; 5 }
6. css 设置背景透明
1 .lucencyBg{ 2 line-height: 1.5 !important;">transparent; 3 }
7. css 文字中间划横线效果
1 .txtDec{ 2 text-decoration:line-through; 3 }
8. css 背景图片定位 (通常为负数)
1 .posBg{ 2 background-position:x y; 3 }
9. css 下拉框去掉三角形
1 .selectStyle{ 2 appearance:none; 3 -moz-appearance:none; 4 -webkit-appearance:none; 5 }
10. css 输入框没有选中效果
1 .inp{ 2 outline:none; 3 }
11. css 禁止页面图片拖曳 ( body )
1 body{ 2 oncontextmenu="return false" ondragstart="return false" tstart="return false" 3 }
12. css 防止点击出现透明背景问题
1 .colorBg{ 2 -webkit-tap-highlight-color:rgba(0,0,0,0); 3 }
13. css 未知宽度水平居中 相对浮动
1 .unknow_width_center1 {position:relative; left:50%; float:left;} 2 .unknow_width_center1 li {position:relative; right:50%; z-index:2; float:left;}
14. css 容器内完全居中(垂直 & 水平)
1 .parent{ position:relative; width:300px; height:300px; margin:0 auto;} 2 .child{ position:absolute; left:0; right:0; bottom:0; top:0; width:50px; height:50px; overflow:auto; margin:auto;}
15. css 容器内文字垂直居中
1 .outer { display:table; width:578px; overflow:hidden;} 2 .middle {display:table-cell; vertical-align:middle;}
1 /*下面的CSS是针对IE7,IE6*/ 2 <!--[if lte IE 7]> 3 <style> 4 .outer{position:relative;} 5 .middle{position: absolute; top: 50%;} 6 .inner{position: relative; top:-50%} 7 </style> 8 <![endif]-->
16. css 输入框/输入区域不可随意拖动大小
1 .textarea{ resize:none; }
17. css radio / checkbox 选中样式设置
1 input[type=radio]{ 2 -webkit-appearance: none; 3 appearance: none; 4 width:15px; 5 height:15px; 6 margin-top:-2px; 7 margin-left:3px; 8 cursor: pointer; 9 vertical-align:middle; 10 -webkit-border-radius:15px; 11 -moz-border-radius:15px; 12 border-radius:15px; 13 border:1px solid #e29452; 14 ">#fff; 15 }
16 input[type=radio]:checked::after { 17 content: url(../images/check.png); 18 margin-left:1px; 19 }
标签:str one sele ant ble 下拉 下拉框 table 文本
原文地址:https://www.cnblogs.com/ZJGG/p/9234875.html