2018-04-11 HTML+css首次实践简单的界面

一部分css内容

.top{

    height:140px;

    padding:10px;

background-color:#66BFA7;

margin-bottom:0px;

}

.circle{

height:60px;

width:60px;

margin-top:30px;

background-color:white;

    border-radius:60px;

}

.middle{

margin-top:0px;

height:30px;

background:#5CB9A7;

margin-bottom:15px;

}

.wenzi1{

font-size:15px;

color:white;

padding-top:10px;

}

.wenzi2{

font-size:12px;

color:white;

}

.div-inline1{

display:inline;

margin-top:5px;

margin-left:10px;

padding-right:30px;

border:none;

border-right:1px solid white;

font-size:18px;

}

.div-inline2{

display:inline;

margin-left:5px;

font-size:18px;

}

.icon{

margin-left:10px;

background-color:red;

height:20px;

width:20px;

border-radius:20px;

display:inline;

}

.icon1{

margin-left:15px;

background-color:red;

height:20px;

width:20px;

border-radius:20px;

display:inline;

}

.icon2{

margin-left:35px;

background-color:red;

height:20px;

width:20px;

border-radius:30px;

display:inline;

}

.label1{

color:red;

}

.label2{

color:white;

}

.project1{

margin-top:6px;

border:none;

border-top:1px solid #CDCDCD;

margin-right:10px;

margin-left:10px;

}

.project1-1{

color:#838585;

display:inline;

margin-left:5px;

font-size:15px;

}

.project1-2{

margin-left:10px;

float:right;

font-size:23px;

color:#74C4B0;

font-weight:bold;

}

.project2{

margin-top:6px;

border:none;

border-top:1px solid #CDCDCD;

border-bottom:1px solid #CDCDCD;

margin-right:10px;

margin-left:10px;

padding-bottom:5px;

}

.project3{

background:#FFB164;

color:white;

height:20px;

margin-top:60px;

}

.end{

margin-top:8px;

background:#CDCDCD;

height:50px;

}

overflow: hidden; /*防止内容超出容器或者产生自动换行*/