一些漂亮的样式

背景色

#333 详见:http://v3.bootcss.com/examples/cover/#

#333    

html, body {
    height: 100%;
    background-color: #333;
}

.site-wrapper {
    display: table;
    width: 100%;
    height: 100%;
    min-height: 100%;
    -webkit-box-shadow: inset 0 0 100px rgba(0,0,0,.5);
    box-shadow: inset 0 0 100px rgba(0,0,0,.5);


小程序

背景采用淡灰白色:  background:#F6F6F6
区块边框使用黑色透明: border:1px solid rgba(0, 0, 0, .1);

区块背景使用纯白色: background:#FFF;

字体颜色: color:#222;

字体颜色: color:#666;

disable 字体颜色: color:#888;

上边距: margin-top:40rpx;

p段落:

        margin-top:20rpx;

        font-size:28rpx;

        line-height:36rpx;

        color:#666;

微信截图_20180108230802.pngQQ截图20180108231051.png

分割线

border-bottom: 1px dotted #C6C6C6;

灰色字体

color: #8B8B8B;

盒子立体阴影效果

box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);

Web文字呈现

  1. font-size1rem;

  2.    color#757575;

  3.    font-weight400;

  4.    line-height2.6rem;

font-family"Monospaced Number",Chinese Quote,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif;

发表评论