text-align: center;——子item居中对齐
display: flex;——子item横向布局
-webkit-justify-content: center;——子item居中
margin: auto;——子item居中
background: #f4f4f4;——背景色（background-color:yellowgreen;）
opacity: 0.5;——透明度
border-top: 0.13333rem solid #a1c9f8;——边界宽度及颜色（上边框）
border: 1px solid #fff;——全边框
border-color: #0CD5E5 #0CD5E5 #0CD5E5 #0CD5E5;——四色边框（渐变色）
border-radius: 16px;——圆角边框
style="background-image:url(images/mybg.png) ;height: 250px——背景图片
<img src="image/01.jpg" height="270" width="479" >——加载图片
letter-spacing:5px;——文本间距
（1）重叠布局
div实例
<div class="bigDiv"><div class="smallDiv1"></div><div class="smallDiv2"></div></div>
css实现重叠布局
.bigDiv{
position: relative;
}
.smallDiv1{
position: absolute;
z-index: 2;
}
.smallDiv2{
position: absolute;
z-index: 1;
}
附：
1、子绝父相：儿子绝对定位，父亲相对定位
2、z-index：层次；值越大放置越靠上
（2）div固定在底部css
.footer{
height: 20px;
width: 100%;
display: flex;
position: fixed;
bottom: 0;
text-align: center;
}
（3）input的无边框显示下划线
.inputclass{
border: none;
font-size: 15px;
height: 20px;
width: 100%;
margin-top: 3px;
letter-spacing:5px;
margin-left:12px;
margin-right: 40px;
padding-bottom: 5px;
border-bottom: 1.5px solid #DBDBDB;
}
（4）相对定位与绝对定位布局
母层使用相对布局：
position: relative;
子层使用绝对布局，位居底部
.box .bg{
background-color: #000;
opacity: 0.5;
width: 100%;
height: 40px;
/* 绝对定位 */
position: absolute;
bottom:0px;
/* 层级： */
z-index:100; /* -999-0+999 */
}
微信小程序——wxss:
flex-direction: row;——横向布局
flex-direction: column;——纵向布局+display: flex;
flex: 1;——————————单行
justify-content: space-between;——item平分母尺寸居中显示
border-bottom: 1px solid rgb(197, 199, 199);——item底部分割线
css属性基础以及wxss——居中 渐变色边框 圆角边框 横向布局 重叠div div固定在底部 input的无边框显示下划线
