2018-11-01自己写的静态网页

线上商店的静态首页

    
        
        
        
        
        
    
    
        

        

            
Android Marketplace
        
        

            
老叶叶材
        
        

            

                商店介绍
            
            

                全部商品
            
            

                成品花
            
            

                叶材
            
            

                花材
            
            
        
    

跳转到叶材的页面(静态的)

    
        
        
        
        
        
        
        
        
    
    
        
        

            
老叶叶材
        
        
        

            
---------------------- 商店地址:成都市锦江区三圣乡万福花卉产业园A1-4-5 ----------------------
        
        
        

    
            
            

                

                

                

                

                

                

            
            
            

                

                    全部分类
                
                

                    精品类
                
                

                    树枝类
                
                

                    松枝类
                
                

                    绿叶类
                
                

                    红叶类
                
                

                    草叶类
                
                

                    回到首页
                
            
            
        
        
    

叶材样式表(css)

/* ========通用=========== */
*{
    margin: 0px;
    border: 0px;
    padding: 0px;
    position: relative;
}

/* ================顶部标题========== */
#top{
    height: 90px;
    background: white;
    
}
#top p{
    font-size: 60px;
    color: #000000;
    text-align: center;
    line-height: 90px;
    font-weight: 300;
}
/* =============顶部提示区========== */
#bottom{
    height: 30px;
    width: 100%;
    border-top: solid gray 1px;
    border-bottom: solid gray 1px;
}
#bottom p{
    font-size: 10px;
    color: #000000;
    text-align: center;
    line-height: 30px;
    font-weight: 100;
}
/* ============中间========== */
#middle{
    float: left;
    height: 700px;
    width: 100%;
}
/* ================中间商品区========== */
#middle1{
    float: right;
    height: 700px;
    width: 90%;
    
    
}
#middle1 div{
    float: left;
    height: 330px;
    width: 300px;
    background-color: #A9A9A9;
    border: solid white 10px;
}

/* ================中间导航区========== */
#navigation{
    /* 高度和宽度 */
    
    height: 700px;
    width: 9.8%;
    /* 导航区边框 */
    border-right: solid gray 1px;
    border-left: solid gray 1px;
    
}
#navigation div{
    
    height: 12.4%;
    width: 100%;
    border-bottom: solid gray 1px;
    /* 水平居中 */
    text-align: center;
    /* 垂直居中 */
    line-height: 12.4%;
    
}
#navigation div a{
    background-color: #FFFFFF;
    /* 水平居中 */
    text-align: center;
    /* 垂直居中 */
    line-height: 12.4%;
    font-size: 20px;
    font-weight: 100;
    
}

未完待续～