1.修改滚动条样式:
.con{
width: 200px;
height: 200px;
border: 1px solid #ddd;
overflow-y: scroll;
margin: 120px auto;
/*IE浏览器下的滚动条颜色设置,只能修改颜色*/
/*三角箭头的颜色*/
scrollbar-arrow-color: #f00;
/*滚动条滑块按钮的颜色*/
scrollbar-face-color: #ff0;
/*滚动条整体颜色*/
scrollbar-highlight-color: #333;
/*滚动条阴影*/
scrollbar-shadow-color: #ccc;
/*滚动条轨道颜色*/
scrollbar-track-color: #666;
}
/*只有webkit内核的浏览器才生效,火狐浏览器目前没有直接修改滚动条样式的方法,除非是使用插件*/
/*滚动条整体部分,必须要设置*/
::-webkit-scrollbar
{
width: 4px;
height: 4px;
}
/*滚动条的轨道*/
::-webkit-scrollbar-track
{
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
border-radius: 0;
background: rgba(0,0,0,0.1);
}
/*滚动条的滑块按钮*/
::-webkit-scrollbar-thumb
{
box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
border-radius: 10px;
background-color: #eee;
background: rgba(0,0,0,0.2);
}
/*滚动条的上下两端的按钮*/
::-webkit-scrollbar-button{
height: 10px;
background-color: blue;
}
2.修改placeholder样式:
/*webkit/blink内核的浏览器,含chrome、safari、opera、360*/
#input::-webkit-input-placeholder{
color:blue;
}
/* Firefox版本4-18 */
#input:-moz-placeholder{
color: green;
}
/* Firefox版本19+ */
#input::-moz-placeholder{
color: green;
}
/* IE浏览器,适用于IE10、11,IE9及以下版本不支持placeholder */
#input:-ms-input-placeholder{
color: red;
}
3.表单元素自动聚焦autofocus=“autofocus”