整理一些用到确想不起来的css样式设置
这些是楼主本人在开发过程中遇到的一些的css样式问题,百度上也很容易查到,并没有说经常用,但是偶尔写到这些都要再问一次度娘,为了不在麻烦度娘,这次索性整理一下。
一、input placeholder属性样式设置方式
html部分
css部分设置placeholder属性值的字体大小为1rem,其他样式设置与字体样式的设置方法一样。
input::-webkit-input-placeholder { /* WebKit browsers */ font-size: 1rem; } input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ font-size: 2rem; } input::-moz-placeholder { /* Mozilla Firefox 19+ */ font-size: 1rem; } input:-ms-input-placeholder { /* Internet Explorer 10+ */ font-size: 1rem; }
样式显示效果。
二、自定义checkbox
HTML部分
<input type="checkbox" id="myCheck"> <label for="myCheck"></label>
CSS部分
input{ display: none; } #myCheck + label{ background-color: white; border-radius: 50%; border:1px solid #11c692; background-color: #11c692; width:20px; height:20px; display: inline-block; text-align: center; vertical-align: middle; line-height: 20px; color: #fff; } #myCheck:checked + label{ background-color: #11c692; } #myCheck:checked + label:after{ content:"\2714"; }
三、首行缩进
text-indent:2em
段落中文字首行缩进2个字符的距离
四、光标样式设置
cursor 属性规定要显示的光标的类型(形状)