静态网页——链家

页面效果

HTML

    
    
    
    


    

        

            
            
重庆
        
        
        

            二手房
            新房
            租房
            海外
            商业办公 
            小区
            百科
            ◆发布房源
            贝壳研究院
            下载APP
            
            登录
            /
            注册
        
           

        

            

                
二手房  /  租房  /  新房
            
            

                
好房好服务   找房上贝壳
            
            

                找二手房
                找新房
                找小区
                找租房 
            
            

                
            
            

                重庆二手房热销 88744套
            
            
        
    
    

        

            

                
二手房
                

                    好房源那么多，我们为你精选
                    更多重庆二手房   
                
            
            

                

                    

                        
                    
                    
江北·大石坝
                    
东方港湾
                    

                        3室2厅·122.11平米 
                        130万
                    
                    
                
                

                    

                        
                    
                    
沙坪坝·大学城
                    
金科廊桥水乡四组团
                    

                        3室1厅·101.19平米
                        106万
                    
                    
                
                

                    

                        
                    
                    
沙坪坝·大学城
                    
贝蒙天地
                    

                        4室2厅·161平米 
                        228万
                    
                    
                
                

                    

                        
                    
                    
九龙坡·谢家湾
                    
华宇春江花月
                    

                        2室1厅·78.95平米
                        98万
                    
                    
                
            
        
        

            

                
小区精选
                

                    纵览小区，恋上这座城
                    更多重庆小区   
                
            
            

                

                    

                    
江北·大石坝
                    
东方港湾
                    

                        3室2厅·122.11平米 
                        130万
                    
                    
                
                

                    

                    
沙坪坝·大学城
                    
金科廊桥水乡四组团
                    

                        3室1厅·101.19平米
                        106万
                    
                    
                
                

                    
 
                    
沙坪坝·大学城
                    
贝蒙天地
                    

                        4室2厅·161平米 
                        228万
                    
                    
                
                
            
        
    

    
    

CSS

body,p{
    margin: 0;
    background-image: url(../images/bk/bg.jpg);
    background-repeat: no-repeat;
    background-position: center 0;
}
header{
    width: 100%;
    height: 600px;
    padding: 50px 100px 0 50px;
}   
header .header_left{
    float: left;
}

header .location{
    float: right;
    width: 40px;
    height: 30px;
    border: 2px solid  white;
    border-radius: 30px;
    font-size: 14px;
    color: white;
    line-height: 30px;
    padding-left: 35px;
    background-image: url(../images/bk/location.png);
    background-repeat: no-repeat;
    background-position: 10px center;
    margin-left: 30px;
    
}

header .header_right{
    padding-left: 1000px;
}
.header_right a{
    text-decoration: none;
    color: white;
    font-size: 16px;
    font-weight: bold;
    margin-right: 15px;
} 
.header_right span{
    color: white;
}  
 header .header_center{
    width: 800px;
    margin-left: 400px;
    overflow: hidden;
    margin-top: 130px;
}
.header_center .c1{
    color: white;
}
.header_center .c2{
    color: white;
    font-size: 32px;
}
.c3 a{
    display: block;
    text-decoration: none;
    color:#333;
    font-size: 16px;
    font-weight: bold;
    float: left;
    margin-left: 18px;

}
.c3 a:nth-child(1){
    color: white;
}
.c3 a:hover{
    color: white;
}
.header_center .c4{
    width: 600px;
    height: 70px;
}
.c4 input{
    float: left;
   margin-top: 20px;
   border: none;
}
.c4 button{
    background-color: rgb(91, 91, 236);
    border: none;
    margin: 0;
    padding: 0;
    float: left;
    margin-top: 20px;
}
.header_center .c5{
    width: 200px;
    height: 28px;
    background-image: url(../images/bk/news.png);
    background-repeat: no-repeat;
    color: white;
    font-size: 14px;
    margin-top: 60px;
}
.c5 span{
    padding-left: 40px;
    line-height: 28px;
}
.tro{
    width: 100%;
    overflow: hidden;
    margin: auto;
}
.tro .t1{
    width: 1210px;
    overflow: hidden;
    margin: auto;
}
.t1 .bt{
    width: 100%;
    overflow: hidden;
    background-image: none;
}
.bt h2{
    font-size: 35px;
    margin: 0;
    padding: 0;
    margin-bottom: 10px;
}
.bt .bt_h{
    width: 100%;
    height: 20px;
    margin-bottom: 20px;
}
.bt span{
    font-size: 16px;
    color: #616669;
    float: left;
    font-weight: bold;
    line-height: 20px;
}
.bt a{
    display: block;
    float: right;
    text-decoration: none;
    color: rgb(91, 91, 224);
    line-height: 20px;
}
.bt .nte{
    width: 100%;
    overflow: hidden;
}
.nte .js{
    width: 280px;
    overflow: hidden;
    margin-right: 30px;
    float: left;
}
.js .js_bj{
    width: 280px;
    height: 210px;
    background-image: url(../images/bk/img01.jpg);
    background-repeat: no-repeat;
    position: relative;
    margin-bottom: 15px;
}
.js_bj a{
    display: block;
    position: absolute;
    right: 0;
    top: 0;
}
.js p{
    font-size: 18px;
    font-weight: bold;
    color: #222222;
    background-image: none;
}
.js .xxjs{
    width: 280px;
    height: 20px;
    margin-top: 15px;
}
.js span:nth-child(1){
    float: left;
    font-size: 12px;
    color: #616669;
    line-height: 20px;
}
.js span:nth-child(2){
    float: right;
    font-size: 16px;
    color: #fa5741;
    font-weight: bold;
    line-height: 20px;
}
.js .js_bj:nth-child(2){
    background-image: url(../images/bk/img02.jpg);
}
.js .js_bj:nth-last-child(2){
    background-image: url(../images/bk/img03.jpg);
}
.js .js_bj:nth-last-child(1){
    background-image: url(../images/bk/img04.jpg);
}
.nte .js:nth-last-child(1){
    margin-right: 0;
}