css---整理(一)

1、改变placeholder颜色

.input:-ms-input-placeholder{ /*ie10及以上*/
     color:red;
}
.input::-webkit-input-placeholder{ /*谷歌*/
     color:red;
}
.input:-moz-placeholder{ /*火狐4-18*/
     color:red;
}
.input::-moz-placeholder{ /*火狐19+*/
     color:red;
}

 

2、去掉ie下文本框的叉号

input::-ms-clear{
      display:none;
}

3、去掉ie下密码框的眼睛图标

input::-ms-reveal{
      display:none;
}

4、单行文本溢出

.txt{
     display:block;
     width:100px;  /*必须设置一个固定的宽度*/
     overflow:hidden;
     white-space:nowrap;  /*强制文本一行内显示*/
     text-overflow:ellipsis; /*显示省略号*/
}

5、多行文本溢出

var str=$("p").text();
if(str.length>36){
    str=str.substr(0,36)+"...";
    $('p').text(str);
}
    

6、背景透明度

.img{
      filter:alpha(opacity=50);  
      -moz-opacity:0.5;  
      -khtml-opacity: 0.5;  
      opacity: 0.5;  
}

 7、去掉input 输入内容时出现的蓝色边框

input:focus{
      outline:none;
}

8、textarea 隐藏右下角的图标

textarea{
     resize:none;
}

9、input中padding-right在ie下显示不成功原因是ie将padding-right看作是输入文本距离文本边界的值,而不是文本显示区域和边框间的距离。

10、img图片之间有间距设置图片display:block;左浮动可以解决。

11、重写单选框和多选框样式,建议:(label不能写for属性,input设置透明度是0)

    

<label>
	<input type="radio" name="time-radio">
	<span class="choose-style"><i class="icon-active"></i></span>
        111
</label>

12、chrome浏览器表单自动填充默认样式-autofill解决方法

https://blog.csdn.net/zhangdongxu999/article/details/73741390

13、css特殊字体转换

https://www.kirsle.net/wizards/ttf2eot.cgi

http://www.font2web.com//?error=generic_error

 

posted @ 2017-07-31 15:44  ~面朝大海,春暖花开~  阅读(105)  评论(0编辑  收藏  举报