2019独角兽企业重金招聘Python工程师标准>>> 
全局设置
1, body设置了默认的字号为14号，微软雅黑字体，以及文字颜色#414141. 2, 所有元素的大小、宽度、间距等皆使用10px为基准 rem为单位设置 例如：
.demo{ font-size:1.2rem; //相当于字号font-size:12px;}
.demo{ margin:0.4rem 1rem; //相当于设置外间距margin:4px 10px;}
常用class属性设置
图片横向全屏 class="img-full" 图片横向沾满外部盒子空间，高度自适应，如需高度也沾满盒子 请执行设置height:100%; 使用方法
<div><img src="" class="img-full"></div>
截图文字
class="clamp1" 文字以一行显示，多余的部分自动截取并以点显示。
class="clamp2" 文字以两行显示，多余的部分自动截取并以点显示。
浮动
class="clearfix"或 class="clear" 父级清除浮动，使用clearfix 或clear。
class="fl" 左浮动
class="fr" 右浮动
数字字体
class="Arial" 英文文字字体 font-family:Arial, Helvetica, sans-serif;
设置字号
class="fz10" <=> font-size:10px; class="fz11" <=> font-size:11px;
class="fz12" <=> font-size:12px; class="fz13" <=> font-size:13px;
class="fz14" <=> font-size:14px; class="fz15" <=> font-size:15px;
class="fz16" <=> font-size:16px; class="fz18" <=> font-size:18px;
class="fz20" <=> font-size:20px; class="fz21" <=> font-size:21px;
class="fz22" <=> font-size:22px; class="fz24" <=> font-size:24px;
内间距设置
class="pt2" <=>padding-top:2px; class="pt4" class="pt5"
class="pt8" class="pt10" class="pt12" class="pt15"
class="pt20"
同理 class="pb2" //padding-bottom:2px
class="pl2" //padding-left:2px
class="pr2" //padding-right:2px
**外间距设置**
class="mt2" <=>margin-top:2px; class="mt4" class="mt5"
class="mt8" class="mt10" class="mt12" class="mt15"
class="mt20"
同理 class="mb2" //margin-bottom:2px
class="ml2" //margin-left:2px
class="mr2" //margin-right:2px
元素位置左右中
class="text-left" //text-align:left;
class="text-center" //text-align:center;
class="text-right" //text-align:right;
圆角设置
class="radius2" <=>border-radius:2px; class="radius3" <=>border-radius:3px;
class="radius4" <=>border-radius:4px; class="radius5" <=>border-radius:5px;
class="radius6" <=>border-radius:6px; class="radius8" <=>border-radius:8px;
class="radius10" <=>border-radius:10px; class="radius20" <=>border-radius:20px;
class="radius50" <=>border-radius:50%;
按钮
class="btn-big" //大按钮，根据需求改变不同的背景色即可
class="btn-rule" //活动规则，根据需求改变不同的背景色即可
无数据提示
class="no-data" //无数据时，显示的提示信息样子
文件链接
全局设置
1,重置样式
* {
margin: 0;
padding: 0;
-webkit-text-size-adjust: none;
-webkit-appearance: none;
box-sizing: border-box
}
2, body设置了默认的字号为14号，微软雅黑字体，以及文字颜色#414141.
html {
-webkit-tap-highlight-color: transparent;
font-size: 62.5%
}
body {
max-width: 640px;
margin: 0 auto;
color: #414141;
font-family: Arial,'Microsoft Yahei';
font-size: 1.4rem;
line-height: 1.5em;
}
3, 所有元素的大小、宽度、间距等皆使用10px为基准 rem为单位设置 例如：
.demo{ font-size:1.2rem; //相当于字号font-size:12px;}
.demo{ margin:0.4rem 1rem; //相当于设置外间距margin:4px 10px;}
常用class属性设置
图片横向全屏 class="img-full" 图片横向沾满外部盒子空间，高度自适应，如需高度也沾满盒子 请执行设置height:100%; 使用方法
<div><img src="" class="img-full"></div>
截图文字
class="clamp1" 文字以一行显示，多余的部分自动截取并以点显示。
class="clamp2" 文字以两行显示，多余的部分自动截取并以点显示。
浮动
class="clearfix"或 class="clear" 父级清除浮动，使用clearfix 或clear。
class="fl" 左浮动
class="fr" 右浮动
数字字体
class="Arial" 英文文字字体 font-family:Arial, Helvetica, sans-serif;
设置字号
class="fz10" <=> font-size:10px; class="fz11" <=> font-size:11px;
class="fz12" <=> font-size:12px; class="fz13" <=> font-size:13px;
class="fz14" <=> font-size:14px; class="fz15" <=> font-size:15px;
class="fz16" <=> font-size:16px; class="fz18" <=> font-size:18px;
class="fz20" <=> font-size:20px; class="fz21" <=> font-size:21px;
class="fz22" <=> font-size:22px; class="fz24" <=> font-size:24px;
内间距设置
class="pt2" <=>padding-top:2px; class="pt4" class="pt5"
class="pt8" class="pt10" class="pt12" class="pt15"
class="pt20"
同理 class="pb2" //padding-bottom:2px
class="pl2" //padding-left:2px
class="pr2" //padding-right:2px
**外间距设置**
class="mt2" <=>margin-top:2px; class="mt4" class="mt5"
class="mt8" class="mt10" class="mt12" class="mt15"
class="mt20"
同理 class="mb2" //margin-bottom:2px
class="ml2" //margin-left:2px
class="mr2" //margin-right:2px
元素位置左右中
class="text-left" //text-align:left;
class="text-center" //text-align:center;
class="text-right" //text-align:right;
圆角设置
class="radius2" <=>border-radius:2px; class="radius3" <=>border-radius:3px;
class="radius4" <=>border-radius:4px; class="radius5" <=>border-radius:5px;
class="radius6" <=>border-radius:6px; class="radius8" <=>border-radius:8px;
class="radius10" <=>border-radius:10px; class="radius20" <=>border-radius:20px;
class="radius50" <=>border-radius:50%;
按钮
class="btn-big" //大按钮，根据需求改变不同的背景色即可
class="btn-rule" //活动规则，根据需求改变不同的背景色即可
