css 背景与 页面元素相结合

阅读更多

代码

  

    

     
    
    

      
更多>>
      

      
      
    
    

    

        
注册和登录提示：
        

        1、

        2、 

        3、
    
  
   
  

  
版权所有

注释：

最外层div css :   div class="bgwrap"

.bgwrap {
            background: url(../img/bg_02.png) center top no-repeat;
            height: 595px;
} 

center ： 表示背景图片随浏览器宽度改变时，保持图片中心显示在浏览器的中心

内容div css ： div class="login_wrap"

.login_wrap {
    width: 700px;
    margin: 0 auto;
    margin-top: 100px;
    height: 310px;
} 

margin : auto 使页面宽度随浏览器改变时，整个div仍能居中

这2个属性的设置，确保了 内容div 中的元素 与 最外层div 的背景，随浏览器的宽度改变时，相一致。



效果图：

结合前：




结合后：




当然，输入框 input 的 css 要设置：

.login_wrap table td input.long_mhy {
    width: 140px;
    height: 30px;
    line-height: 30px;
    margin-left: 8px;
    background: none;
    border: none;
} 

    border: none :  不显示边框（边框使用背景）
   







参考更多：

http://nodebook.info/book/view?bid=53523a3c19980e913e9be3ee





--

• 
• 大小: 3.6 KB

• 
• 大小: 7.6 KB

• 查看图片附件