global.css

/*==========================全局公用样式、工具性样式============================*/
/********************显隐类*******************/
.ho-i{/*透明性隐藏*/
	opacity:0!important;
}
.hv-i{/*可见性隐藏*/
	visibility:none!important;
}
.h-i,.hd-i{/*显示(渲染性)性隐藏*/
	display:none!important;
}
.hp-i{/*位置偏移*/
	position: absolute!important;
   	top: -9999px!important;
   	left: -9999px!important;
}
.s-i{/*show*/
	display:block!important;
}
.ho{/*透明性隐藏*/
	opacity:0;
}
.hv{/*可见性隐藏*/
	visibility:none;
}
.h,.hd{/*显示(渲染性)性隐藏*/
	display:none;
}
.hp{/*位置偏移*/
	position: absolute;
   	top: -9999px;
   	left: -9999px;
}
.s{/*show*/
	display:block;
}
/********************排版类*******************/
.fwbold{
	font-weight: bold;
}
.fwbolder{
	font-weight: bolder;
}
.text-ellipsis{
	/*width: 100px; 宽度需要设置,ellipsis才生效*/
	overflow: hidden; 
	white-space: nowrap; 
	text-overflow: ellipsis;
}
/********************边框类*******************/
.b-r{
	border:1px solid red;
}
.b-2r{
	border:2px solid red;
}
.b-g{
	border:1px solid green;
}
.b-2g{
	border:2px solid green;
}
.b-b{
	border:1px solid blue;
}
.b-2b{
	border:2px solid blue;
}
/********************背景类*******************/
.bk-r{
	background:red;
}
.bk-g{
	background:green;
}
.bk-b{
	background:blue;
}
/*********************布局类*****************/
.pull-right{
	float:right;
}
.pull-left{
	float:left;
}
.clr:after{
	content: "";
	display: block;
	clear: both;
}
.clr{
	*zoom:1;/*for IE ，active the 'hasLayout'*/
}
.pf {
    position: fixed;
    -webkit-transform: translateZ(0);/*chrome 内核浏览器 position: fixed 防止抖动*/
}
.middle {/*利用绝对定位宽高拉升原理，中心居中元素*/
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}
.middle-r{/*利用相对定位和`CSS3`使元素垂直居中*/
    position: relative;
    top: 50%;
    -webkit-transform: -webkit-translateY(-50%);
    -moz-transform: -moz-translateY(-50%);
    -o-transform: -o-translateY(-50%);
    transform: translateY(-50%);
}
.bs-bb{/*元素计算宽高的盒子模型以`border`为外界限*/
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
/*********************样式重置类*****************/
html,
body { 
    width: 100%;/* 当body宽度大于html宽度时，某些浏览器会出现内部滚动条，所以给html、body设置宽度100%*/
    
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);/*取消部分浏览器点击有阴影*/
    
    -webkit-overflow-scrolling: touch;/* 优化移动端滚动事件*/
    overflow-scrolling: touch;
	
    -webkit-font-smoothing: antialiased;/*使字体渲染更顺滑*/
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
body,p,h1,h2,h3,h4,h5,h6,dl,dd,ul,ol,th,td,button,figure,input,textarea,form,pre,code,legend,fieldset,blockquote {/*移除常用标签margin、padding*/
    margin: 0;
    padding: 0;
}
input,select,textarea {/*不同浏览器的input、select、textarea的盒子模型宽度计算方式不同，统一为content-box*/
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}
table {/*table相邻单元格的边框间的距离设置为0,设置table的边框为合并模式*/
    border-spacing: 0;
    border-collapse: collapse;
}
img,input,button,textarea,acronym,fieldset {/*移除浏览器部分元素的默认边框*/
    border: none;
}
textarea {/*让textarea默认不可以放缩*/
    resize: none;
}
/**
 * 因为部分浏览器默认的`q`标签的前后伪元素有多余样式，所以置空`q`标签前后伪元素。
 * q标签不是很常见，如果开发者需要可以使用。
/*
q::before,
q::after {
    content: '';
}
*/
/**
 * 由于以下元素的部分属性没有继承父节点样式，所以声明这些元素的这些属性为父元素的属性。
 * 取消这些元素的`outline`样式。
 */
a,
h1,
h2,
h3,
h4,
h5,
h6,
input,
select,
button,
option,
textarea,
optgroup {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    font-style: inherit;
    line-height: inherit;
    color: inherit;
    outline: none;
}
input::-moz-focus-inner {/*取消火狐浏览器部分版本input聚焦的时候默认的padding、border*/
    padding: 0;
    border: 0;
}
input[type='number'] {/*取消部分浏览器input[type='number']的默认样式*/
    -moz-appearance: textfield;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    margin: 0;
    -webkit-appearance: none;
}
/*输入控件的placeholder颜色设置为#999（浅灰色）*/
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder {
    color: #999;
}
input:-moz-placeholder,textarea:-moz-placeholder {
    color: #999;
}
input::-moz-placeholder,textarea::-moz-placeholder {
    color: #999;
}
input:-ms-input-placeholder,textarea:-ms-input-placeholder {
    color: #999;
}
/*解决手机端输入框获得焦点后页面放大，浏览器默认focus状态下字体大于等于16px时用户才看得清，所以在字体小于16时会放大页面*/
@media only screen
and (min-device-width : 320px)
and (max-device-width : 1024px) {
	select:focus,
	textarea:focus,
	input:focus {
		font-size: 16px !important;
	}
}
template {/*由于部分浏览器template直接显示出来，所以要隐藏template元素*/
    display: none;
}
a{
	cursor:pointer;
	text-decoration:none;
	outline:none;/*IE7以下不识别，需手动在a标签中添加'hidefocus="true"',使用js插件hide-a-outline.js*/
	color:inherit;/*去除浏览器默认颜色*/
	font-size: inherit;
}