圖片為什么會居中不能貼住右邊呢?
.index-header {
}
.index-header .index-header-nav {
? background: #ccc;
? ?height: 50px;
}
.index-header .index-header-nav ul{
? ?list-style: none;
? ?margin: 0;
}
.index-header .index-header-nav ul li {
? ?display: inline-block;
? ?line-height: 50px;
? ?margin-right: 20px;
? ?float: right;
}
.index-header .index-header-nav ul li a{
? ?line-height: 50px;
? ?text-decoration: none;
? ?display: inline-block;
? ?height: inherit;
? ?color: #fff;
}
.index-header .index-header-nav ul li.index-header-nav-logo{
? ?float: left;
}
.index-header .index-header-banner {
? ?background: #777;
? ?height: 700px;
}
.index-header .index-header-banner .index-header-banner-inner{
? ?max-width: 300px;
? ?text-align: center;
? ?margin: 0 auto;
? ?position: relative;
? ?top: 160px;
}
.index-header .index-header-banner .index-header-banner-inner h1{
? ?margin: 0;
}
.index-header .index-header-banner .index-header-banner-inner .sub-heading{
? ?line-height: 30px;
? ?margin: 30px;
}
.index-header .index-header-banner .index-header-banner-inner .more{
? ?margin-top: 280px;
}
button {
? ?border: none;
? ?background: #333;
? ?color:#eee;
? ?padding: 14px 40px;
}
/*.index-header-nav-logo{
? ?font-size: 20px;
? ?font-weight: 700;
? ?letter-spacing: 1px;
? ?float: left;
}
.index-header-nav-logo a{
? ?color: #fff;
}*/
.green-section{
? ?text-align: center;
? ?background: #089DB0;
? ?color: #fff;
? ?padding: 100px 0;
}
.green-section .hr{
? ?background: #078494;
? ?width: 60%;
}
.green-section .icon-group .icon{
? ?display: inline-block;
? ?width: 80px;
? ?height: 80px;
? ?border: 1px solid #0D6F7C;
? ?transform: rotate(45deg);
? ?margin: 20px;
}
.icon-group {
? ?margin-top: 60px;
}
.wrapper {
? ?max-width: 1080px;
? ?margin: 0 auto;
}
.hr{
? ?width: 100%;
? ?height:2px;
? ?margin: 0 auto;
? ?margin:20px auto;
}
.sub-heading {
? ?font-size: 18px;
}
.gray-section{
? ?background: #252f34;
? ?color: #fff;
}
.gray-section .img-section {
? ?width: 45%;
}
.img-section img{
? ?width: 100%;
}
.gray-section .text-section {
? ?witdh:55%
}
.article-preview > div{
? ?float: left;
? ?font-size: 0;
}
.article-preview:nth-child(odd){
? ?background-color: rgba(255,255,255,0.05);
}
.article-preview:after{
? ?content:'';
? ?display: block;
? ?clear: both;
}
.text-section{
? ?position: relative;
? ?top: 68px;
? ?left: 50px;
}
.text-section h2{
? ?margin-top: 20px;
}
.text-section .sub-heading{
? ?font-size: 22px;
}
.text-section p ?{
? ?font-size: 18px;
? ?letter-spacing: 1px;
}
.text-section >*{
? ?max-width: 50%;
}
2016-09-09
因為你文字那里是設置relative,會占位置,所以圖片被文字頂到中間了,將relative改成absolute