前端常见css样式调整

侧边滑动条自定义

	容器::-webkit-scrollbar {   
		width: 6px; //滚动条的宽度
	}
	容器::-webkit-scrollbar-thumb {  
		background-color: #8899A7; //滚动条的颜色   
		border-radius: 3px;//滚动条的边框倒角
	}

** input框 placeholder样式设置**

::-webkit-input-placeholder {} /*使用webkit内核的浏览器*/
:-moz-placeholder {} /*Firefox版本4-18*/
::-moz-placeholder {} /*Firefox版本19+*/
:-ms-input-placeholder {} /*IE浏览器*/

多选框样式

input[tyoe=checkbox]{ 
	-webkit-appearance: none; 
	-moz-appearance: none;  
	width: 16px;   
	height: 16px;   
	border-radius: 2px;  
	background-color: transparent;   
	border: 1px solid #1bba79;   
	float: left;   
	outline: none;
}
input[type=checkbox]:checked{    
	background: #0000ff;
}

移动端网页自适应

html,body{
 font-size: 26.67vw!important
 }
 

文本下划线

text-decoration :   none: 无装饰   
							blink: 闪烁   
							underline:下划线 
							line-through: 贯穿线 
							overline : 上划线

js获取页面元素距离浏览器工作区顶端的距离

**网页被卷起来的高度/宽度（即浏览器滚动条滚动后隐藏的页面内容高度）**  
js:
	document.documentElement.scrollTop  //firefox 
	document.documentElement.scrollLeft  //firefox   	
	document.body.scrollTop  //IE  
	document.body.scrollLeft  //IE  
jq: 
	$(window).scrollTop() 
**//距离顶部高度**  
jq: 
	$(window).scrollLeft() 
**// 距离左边距距离网页工作区域的高度和宽度**   
js: 
	document.documentElement.clientHeight// IE firefox   
jq: 
	$(window).height()
**元素距离文档顶端和左边的偏移值**    
js: 
	DOM元素对象.offsetTop //IE firefox   
	DOM元素对象.offsetLeft //IE firefox    
jq:  
	jq对象.offset().top   
	jq对象.offset().left
**获取页面元素距离浏览器工作区顶端的距离**    
	页面元素距离浏览器工作区顶端的距离 = 元素距离文档顶端偏移值 - 网页被卷起来的高度即：    
	页面元素距离浏览器工作区顶端的距离 = DOM元素对象.offsetTop - document.documentElement.scrollTop

input 苹果兼容性问题

input,textarea{  
	border: 0;    
	-webkit-appearance: none;
}

移动端a标签点击时有阴影

a {    
	outline: none;    
	-moz-outline-style: none;  //适配IOS
}
body{    
	-webkit-tap-highlight-color: rgba(0,0,0,0); //适配IOS
}

常用的苹方字体样式

// 苹方-简 常规体
font-family: PingFangSC-Regular, sans-serif;
// 苹方-简 极细体
font-family: PingFangSC-Ultralight, sans-serif;
// 苹方-简 细体
font-family: PingFangSC-Light, sans-serif;
// 苹方-简 纤细体
font-family: PingFangSC-Thin, sans-serif;
// 苹方-简 中黑体
font-family: PingFangSC-Medium, sans-serif;
// 苹方-简 中粗体
font-family: PingFangSC-Semibold, sans-serif;