mirror of
https://gitee.com/coder-xiaomo/flashsale
synced 2025-01-31 13:30:26 +08:00
249 lines
4.1 KiB
CSS
249 lines
4.1 KiB
CSS
/*** base reset ***/
|
||
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
|
||
pre,code,form,fieldset,legend,input,
|
||
button,textarea,p,blockquote,th,td{
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
fieldset,img{
|
||
border: 0;
|
||
}
|
||
:focus{
|
||
outline:none;
|
||
}
|
||
address,caption,cite,code,dfn,em,strong,th,var,optgroup{
|
||
font-style: normal;
|
||
font-weight: normal;
|
||
}
|
||
abbr,acronym{
|
||
border: 0;
|
||
font-variant: normal;
|
||
}
|
||
code,kbd,samp,tt{
|
||
font-size: 100%;
|
||
}
|
||
input,button,textarea,select{
|
||
*font-size: 100%;
|
||
border:none;
|
||
outline: none;
|
||
}
|
||
ol,ul{
|
||
list-style: none;
|
||
}
|
||
table{
|
||
border-collapse: collapse;
|
||
border-spacing: 0;
|
||
}
|
||
caption,th{
|
||
text-align: left;
|
||
}
|
||
sup,sub{
|
||
font-size: 100%;
|
||
vertical-align: baseline;
|
||
}
|
||
:link, :visited, ins{
|
||
text-decoration: none;
|
||
}
|
||
blockquote,q{
|
||
quotes: none;
|
||
}
|
||
blockquote:before, blockquote:after, q:before, q:after{
|
||
content: '';
|
||
content: none;
|
||
}
|
||
html{
|
||
font-size: 100%;/*浏览器默认16px*/
|
||
height: 100%;
|
||
}
|
||
body,input,button{
|
||
font: 1rem/1.1rem "lucida grande","lucida sans unicode",lucida,helvetica,"Hiragino Sans GB","Microsoft YaHei","WenQuanYi Micro Hei",sans-serif;
|
||
font-weight: 100;
|
||
}
|
||
body{
|
||
background:#fff;
|
||
color:#666;
|
||
height: 100%;
|
||
margin: 0;
|
||
display: block;
|
||
}
|
||
.wrapper{
|
||
position: relative;
|
||
min-height: 100%;
|
||
padding-bottom: 20rem;
|
||
}
|
||
/**--placeholder--**/
|
||
input::-webkit-input-placeholder,
|
||
textarea::-webkit-input-placeholder{
|
||
font: 0.875rem/1.45rem "lucida grande","lucida sans unicode",lucida,helvetica,"Hiragino Sans GB","Microsoft YaHei","WenQuanYi Micro Hei",sans-serif;
|
||
font-weight: 100;
|
||
color: #ddd;
|
||
}
|
||
input:-moz-placeholder,
|
||
textarea:-moz-placeholder{
|
||
font: 0.875rem/1.45rem "lucida grande","lucida sans unicode",lucida,helvetica,"Hiragino Sans GB","Microsoft YaHei","WenQuanYi Micro Hei",sans-serif;
|
||
font-weight: 100;
|
||
color: #ddd;
|
||
}
|
||
input:-ms-input-placeholder,
|
||
textarea:-ms-input-placeholder{
|
||
font: 0.875rem/1.45rem "lucida grande","lucida sans unicode",lucida,helvetica,"Hiragino Sans GB","Microsoft YaHei","WenQuanYi Micro Hei",sans-serif;
|
||
font-weight: 100;
|
||
color: #ddd;
|
||
}
|
||
/**--h1~~h6--**/
|
||
h1,h2,h3,h4,h5,h6,span{
|
||
font-weight: 100;
|
||
}
|
||
h1{
|
||
font-size: 2.25rem;/*36px*/
|
||
line-height: 2.475rem;
|
||
}
|
||
h2{
|
||
font-size: 1.875rem;/*30px*/
|
||
line-height: 2.0625rem;
|
||
}
|
||
h3{
|
||
font-size: 1.5rem;/*24px*/
|
||
line-height: 1.65rem;
|
||
}
|
||
h4{
|
||
font-size: 1.25rem;/*20px*/
|
||
line-height: 1.375rem;
|
||
}
|
||
h5{
|
||
font-size: 1rem;/*16px*/
|
||
line-height: 1.1rem;
|
||
}
|
||
h6{
|
||
font-size: 0.875rem;/*14px*/
|
||
line-height: 0.825rem;
|
||
}
|
||
|
||
/*** common ***/
|
||
/*link style*/
|
||
a:link, a:visited{
|
||
color: #4c4c4c;
|
||
}
|
||
a:hover {
|
||
color: #86d48d;
|
||
}
|
||
a:active {
|
||
color: #4c4c4c;
|
||
}
|
||
/*float*/
|
||
.fl{
|
||
float:left;
|
||
}
|
||
.fr{
|
||
float:right;
|
||
}
|
||
/*clear float*/
|
||
.clearfix:after{
|
||
content:'\0020';
|
||
display:block;
|
||
height:0;
|
||
clear:both;
|
||
visibility:hidden;
|
||
}
|
||
.clearfix{
|
||
*zoom:1;
|
||
}
|
||
.clear{
|
||
height:0;
|
||
overflow:hidden;
|
||
clear:both;
|
||
}
|
||
/*border && padding*/
|
||
.border{
|
||
border: 1px solid #eeeeee;
|
||
}
|
||
.border-btn{
|
||
border: 1px solid #cfcfcf;
|
||
}
|
||
.bl{
|
||
border-left: 1px solid #eeeeee;
|
||
}
|
||
.bb{
|
||
border-bottom: 1px solid #eeeeee;
|
||
}
|
||
.p0_15{
|
||
padding: 0 0.9375rem;
|
||
}
|
||
.p20_0{
|
||
padding:1.25rem 0;
|
||
}
|
||
.p23_0{
|
||
padding:1.4375rem 0;
|
||
}
|
||
.p16_0{
|
||
padding: 1rem 0;
|
||
}
|
||
.p34_0{
|
||
padding: 2.125rem 0;
|
||
}
|
||
.p50_0{
|
||
padding: 3.125rem 0;
|
||
}
|
||
.p0_30{
|
||
padding:0 1.875rem;
|
||
}
|
||
.p0_32{
|
||
padding:0 2rem;
|
||
}
|
||
.p20_32{
|
||
padding:1.25rem 2rem;
|
||
}
|
||
.p8_32{
|
||
padding:.5rem 2rem !important;
|
||
}
|
||
.pt4{
|
||
padding-top:0.25rem;
|
||
}
|
||
.pt20{
|
||
padding-top:1.25rem;
|
||
}
|
||
.pt78{
|
||
padding-top:4.875rem;
|
||
}
|
||
/*颜色定义*/
|
||
/*theme color*/
|
||
.dark-green{
|
||
color:#86d48d;
|
||
}
|
||
.bg-dark-green{
|
||
background:#86d48d;
|
||
}
|
||
.dark-gray{
|
||
color: #666;
|
||
}
|
||
.light-gray{
|
||
color: #acacac;
|
||
}
|
||
.white{
|
||
color: white !important;
|
||
}
|
||
.bold{
|
||
font-weight: bold;
|
||
}
|
||
/*inline-block*/
|
||
.inline-block{
|
||
display: inline-block;
|
||
}
|
||
/*text-align*/
|
||
.text-align-left{
|
||
text-align: left;
|
||
}
|
||
.text-align-center{
|
||
text-align: center;
|
||
}
|
||
.text-align-right{
|
||
text-align: right;
|
||
}
|
||
.text-overflow{
|
||
display:block; /*内联对象需加*/
|
||
word-break:keep-all; /* 不换行 */
|
||
white-space:nowrap; /* 不换行 */
|
||
overflow:hidden; /* 内容超出宽度时隐藏超出部分的内容 */
|
||
text-overflow:ellipsis; /* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden;一起使用。*/
|
||
padding-bottom: 1px;
|
||
} |