generated from zhaoxingchang/i-tax-management-front-lxzy
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
217 lines
4.3 KiB
217 lines
4.3 KiB
/*
|
|
* @名称:base.css
|
|
* @功能:1、重设浏览器默认样式
|
|
* 2、设置通用原子类
|
|
*/
|
|
html {
|
|
font-size: 20px;
|
|
}
|
|
body {
|
|
font-size: 16px;
|
|
font-family: "微软雅黑", serif;
|
|
}
|
|
@media only screen and (max-width: 320px) { html {
|
|
font-size: 42.7px !important;
|
|
}}
|
|
@media only screen and (min-width: 321px) and (max-width: 360px) { html {
|
|
font-size: 48px !important;
|
|
}}
|
|
@media only screen and (min-width: 361px) and (max-width: 375px) { html {
|
|
font-size: 50px !important;
|
|
}}
|
|
@media only screen and (min-width: 376px) and (max-width: 384px) { html {
|
|
font-size: 52.1px !important;
|
|
}}
|
|
@media only screen and (min-width: 385px) and (max-width: 414px) { html {
|
|
font-size: 55.2px !important;
|
|
}}
|
|
@media only screen and (min-width: 415px) and (max-width: 480px) { html {
|
|
font-size: 64px !important;
|
|
}}
|
|
@media only screen and (min-width: 481px) and (max-width: 540px) { html {
|
|
font-size: 72px !important;
|
|
}}
|
|
@media only screen and (min-width: 750px) { html {
|
|
font-size: 100px !important;
|
|
}}
|
|
|
|
/*ios安卓通用1px线*/
|
|
.border {
|
|
box-shadow: inset 0px -1px 0px 0px #EDEDED;
|
|
}
|
|
.border1{
|
|
position:relative;
|
|
}
|
|
.border1:after{
|
|
content:"";
|
|
position: absolute;
|
|
bottom:0px;
|
|
left:0px;
|
|
right:0px;
|
|
border-bottom:1px solid #DEDEDE;
|
|
-webkit-transform:scaleY(.5);
|
|
-webkit-transform-origin:0 0;
|
|
}
|
|
.border-03rem{
|
|
position:relative;
|
|
}
|
|
.border-03rem:after{
|
|
content:"";
|
|
position: absolute;
|
|
bottom:0px;
|
|
left:0px;
|
|
right:0px;
|
|
border-bottom:1px solid #DEDEDE;
|
|
-webkit-transform:scaleY(.5);
|
|
-webkit-transform-origin:0 0;
|
|
margin-left: 0.3rem;
|
|
margin-right: 0.3rem;
|
|
}
|
|
|
|
/* 内外边距通常让各个浏览器样式的表现位置不同 */
|
|
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
|
|
margin:0;
|
|
padding:0;
|
|
-webkit-tap-highlight-color: rgba(0,0,0,0);/*ios去除默认点击阴影效果*/
|
|
}
|
|
/* 去掉 table cell 的边距并让其边重合 */
|
|
table {
|
|
border-collapse:collapse;
|
|
border-spacing:0;
|
|
}
|
|
/* ie bug:th不继承 text-align */
|
|
th {
|
|
text-align:inherit;
|
|
}
|
|
/* 去除默认边框 */
|
|
fieldset,img {
|
|
border:none;
|
|
}
|
|
/* ie678 bug 显示为行内表现 */
|
|
iframe {
|
|
display:block;
|
|
}
|
|
/* 一致的 del 样式 */
|
|
del {
|
|
text-decoration:line-through;
|
|
}
|
|
address,caption,cite,code,dfn,em,th,var {
|
|
font-style:normal;
|
|
font-weight:500;
|
|
}
|
|
/* 去掉列表前的标识,li会继承 */
|
|
ol,ul {
|
|
list-style:none;
|
|
}
|
|
/* 对齐是排版最重要的因素,别让什么都居中 */
|
|
caption,th {
|
|
text-align:left;
|
|
}
|
|
h1,h2,h3,h4,h5,h6 {
|
|
font-weight:500;
|
|
}
|
|
|
|
/* 统一上标和下标 */
|
|
sub,sup {
|
|
font-size:75%;
|
|
line-height:0;
|
|
position:relative;
|
|
vertical-align:baseline;
|
|
}
|
|
sup {
|
|
top:-0.5em;
|
|
}
|
|
sub {
|
|
bottom:-0.25em;
|
|
}
|
|
|
|
/* 让链接在 hover状态下显示下划线 +去除 ie6ie7焦点点状线 */
|
|
a:hover {
|
|
text-decoration:underline;
|
|
}
|
|
a:link {
|
|
text-decoration: none;
|
|
}
|
|
ins,a {
|
|
text-decoration:none;
|
|
}
|
|
a:focus,*:focus {
|
|
outline:none;
|
|
}
|
|
|
|
/* 清除浮动 */
|
|
.clearfix:after {
|
|
content: '';
|
|
display: block;
|
|
clear: both;
|
|
height: 0;
|
|
line-height: 0;
|
|
visibility: hidden;
|
|
overflow: hidden;
|
|
}
|
|
.clearfix {
|
|
zoom: 1;
|
|
}
|
|
|
|
/* 设置显示和隐藏、浮动、定位 */
|
|
.hide {
|
|
display:none;
|
|
}
|
|
.block {
|
|
display:block;
|
|
}
|
|
.fl,.fr {
|
|
display:inline;
|
|
}
|
|
.fl {
|
|
float:left;
|
|
}
|
|
.fr {
|
|
float:right;
|
|
}
|
|
.pr {
|
|
position: relative;
|
|
}
|
|
.pa {
|
|
position: absolute;
|
|
}
|
|
|
|
/* 背景遮罩 */
|
|
.shade{
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
z-index: 100;
|
|
background: rgba(0,0,0,0.70);
|
|
}
|
|
/* 背景底色 */
|
|
.box:before {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
z-index: -100;
|
|
content: " ";
|
|
background-color: #F7F7F7;
|
|
}
|
|
/*背景模糊*/
|
|
/*.blur { */
|
|
/* filter: url(blur.svg#blur); !* FireFox, Chrome, Opera *!*/
|
|
/* -webkit-filter: blur(10px); !* Chrome, Opera *!*/
|
|
/* -moz-filter: blur(10px);*/
|
|
/* -ms-filter: blur(10px); */
|
|
/* filter: blur(10px);*/
|
|
/* filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=10, MakeShadow=false); !* IE6~IE9 *!*/
|
|
/*}*/
|
|
|
|
/*解决浮动 定位的父容器无法被撑开问题*/
|
|
.automatic-Height:after {
|
|
content:".";
|
|
display: block;
|
|
height: 0;
|
|
clear: both;
|
|
visibility: hidden;
|
|
}
|
|
|