需要重疊CSS命令我需要刪除圖像背景。

-1

我有一個主要的css文件..它是所有我的jsp常見的。在我的其他jsp上，我需要刪除背景圖片。我如何重疊它？需要重疊CSS命令我需要刪除圖像背景。

應該重疊的CSS的一部分。

#body .header div { 
    background: url(images/smiling-man.jpg) no-repeat bottom right; --> i want this 
    removed. by overlapping it with another css. 

    height: 472px; 
    margin: 0 auto; 
    padding: 0; 
    width: 960px; 
}

這就是我所做的..只是刪除背景不起作用，並在div上添加了類重疊。

.overlap{ 
    background:none; 
    height: 472px; 
    margin: 0 auto; 
    padding: 0; 
    width: 960px; 
}

我的HTML

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
     pageEncoding="ISO-8859-1"%> 
<%@ taglib prefix="s" uri="/struts-tags" %> 


<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <link rel="stylesheet" type="text/css" href="style.css"> 
     <link rel="stylesheet" type="text/css" href="product.css"> 
     <title>Lot Movement Main Page</title> 
    </head> 
    <body> 
    <body> 
     <div id="header"> 
      <div id="logo"> 
       <a href="index.html"><img src="images/logo.jpg" alt="" /></a>  
      </div> 
      <nav> 
       <ul> 
        <li class="selected"><a href="index.html"><span>home</span></a></li> 
        <li> <a href="#"><span>Product </span></a> 

         <ul> 
          <li> 
           <a href="#"><span>Input</span></a> 
          </li> 

          <li> 
           <a href="#"><span>Enquiry</span></a> 
          </li> 

         </ul> 
        </li> 
        <li><a href="services.html"><span>Movement</span></a></li> 

        <li><a href="contact.html"><span>contact us</span></a></li>   
       </ul> 
      </nav> 
     </div> 
     <div id="body"> 
      <div class="header"> 
       <div id ="prodoverlap"> 

         <h3>Lot Movement Tracking System</h3> 


        </div> 
       </div> 
      </div> 
     </div> 
     <div id="footer"> 
      <div> 
       <div> 
        <h3>AusTralAsia</h3> 
        <ul> 
         <ul> 
          <li>+630212013129 -Main</li> 
         </ul> 
        </ul>   
       </div>  
       <div> 
        <h3>europe</h3> 
        <ul> 
         <li>To Be Announced</li> 
        </ul>   
       </div> 
       <div> 
        <h3>canada</h3> 
        <ul> 

         <li>To Be Announced</li> 
         <li></li> 
        </ul>   
       </div> 
       <div> 
        <h3>middle east</h3> 
        <ul> 

         <li>To Be Announced</li> 
         <li></li> 
        </ul>   
       </div> 
       <div> 
        <h3>follow us:</h3> 
        <a class="facebook" href="http://www.facebook.com/" target="_blank">facebook</a>   
        <a class="twitter" href="http://twitter.com" target="_blank">twitter</a> 
       </div> 
      </div> 
      <div> 
       <p>&copy Copyright 2012. All rights reserved</p> 
      </div> 
     </div> 
    </body> 
</body> 
</html>

我的主要CSS

/* Template by freewebsitetemplates.com */ 
body { 
    font-family: Arial, Helvetica, sans-serif; 
    margin:0; 
    padding: 0; 
} 
#header { 
    margin:0 auto; 
    padding: 0; 
    overflow: hidden; 
    width: 960px; 
} 


#header #logo { 
    float: left; 
    height: 144px; 
    width: 355px; 
} 


#header #logo img { 
    border: 0; 
} 


#header ul li { 
    list-style-type: none; 
    float: left;  
    margin: 0; 
    padding: 0; 
    width: 121px; 
} 


#header ul li a, 
#header ul li a span, 
#header ul li a:hover, 
#header ul li a:hover span, 
#header ul li.selected a, 
#header ul li.selected a span 
    { 
    background: url(images/menu.gif); 
    } 

#header ul li a 
{ 
    background-position: 10px 0; 
    color: #2a4f5e; 
    display: block; 
    font-size: 14px; 
    height: 36px; 
    line-height: 36px; 
    margin: 0; 
    padding: 0 0 0 10px; 
    text-align: center; 
    text-decoration: none; 
    text-transform: uppercase; 
    text-shadow: 1px 1px 1px #fff; 
} 




#header ul li a span 
{ 
    background-position: -70px 0; 
    display: block; 
    margin: 0; 
    padding: 0 10px 0 0; 
} 


#header ul li a:hover { 
    background-position: -186px -37px; 
    color: #346b84; 
    text-shadow: none; 
} 


#header ul li a:hover span { 
    background-position: -70px -37px; 
} 
#header ul li.selected a{ 
    background-position: 10px 36px; 
    color: #fff; 
    text-shadow: none; 
} 
#header ul li.selected a span{ 
    background-position: -70px -74px; 
} 





/*dropdown*/ 

#header ul ul { 
    display: none; 
} 

    #header ul li:hover > ul { 
     display: block; 
    } 


#header ul ul li a span 
{ 
    background-position: -70px 0; 
    font-size: 10px; 
    text-transform: none; 
    display: block; 
    margin: 0; 
    padding: 0 10px 0 0; 
} 


#header ul ul li a:hover { 
    background-position: -186px -37px; 
    color: #346b84; 
    text-shadow: none; 
} 



#body { 
    background: url(images/bg-content.gif) repeat-x top left; 
    margin: 0; 
    padding: 0; 
    min-width: 960px; 
} 
#body .header { 
    background: url(images/bg-body.gif) repeat-x bottom center; 
    margin: 0 0 30px 0; 
} 
#body .header div { 
    background: url(images/smiling-man.jpg) no-repeat bottom right; 
    height: 472px; 
    margin: 0 auto; 
    padding: 0; 
    width: 960px; 
} 
#body .header div div { 
    background: none; 
    margin: 0; 
    padding: 0 0 0 13px; 
    height: 200px; 
    width: 490px; 
} 
#body .header div h3 { 
    color: #2a4f5e; 
    font-size: 20px; 
    line-height: 30px; 
    margin: 18px 0 0 0; 
    padding: 0; 
    text-shadow: 1px 1px 1px #fff; 
} 
#body .header div h3 span { 
    display: block; 
    font-size: 25px; 
} 
#body .header div h3 a { 
    color: #2a4f5e; 
    text-decoration: none; 
} 
#body .header div h3 a:hover { 
    color: #507685; 
} 
#body .header div p { 
    color: #507685; 
    font-size: 14px; 
    line-height: 24px; 
    margin: 12px 0 6px 0; 
    padding: 0; 
    text-shadow: 1px 1px 1px #fff; 
} 
#body .header div p a { 
    color: #507685; 
} 
#body .header div p a:hover { 
    color: #2a4f5e; 
} 
#body .header ul { 
    overflow: hidden; 
    margin: 0; 
    padding: 49px 0 0; 
} 
#body .header ul li { 
    float: left;  
    list-style: none; 
    padding: 0 5px; 
} 
#body .body { 
    border: 1px solid #e0e0e0; 
    margin: 0 auto 34px auto; 
    overflow: hidden; 
    padding: 0 2px; 
    width: 954px; 
} 
#body .body div { 
    float: left;  
} 
#body .body .section { 
    background: url(images/bg-section.gif) repeat-x top left; 
    height: 193px; 
    margin: 0; 
    padding: 35px 0 0 40px; 
    width: 186px; 
} 
#body .body .section img { 
    display: block; 
} 
#body .body .section a { 
    color: #2a4f5e; 
    display: block; 
    font-size: 14px; 
    font-weight: bold; 
    height: 145px; 
    text-align: center; 
    text-decoration: none; 
    text-transform: uppercase; 
    width: 145px; 
} 
#body .body .section a:hover { 
    color: #507685; 
} 
#body .body .section img { 
    border: 0; 
} 
#body .body .article { 
    background: url(images/bg-article.gif) no-repeat top center; 
    overflow: hidden; 
    padding: 19px 16px; 
    width: 470px; 
} 
#body .body .article img { 
    border: 0; 
    float: left; 
    padding: 0 10px 0 0; 
} 
#body .body .article h4 { 
    color: #2a4f5e; 
    font-size: 15px; 
    font-weight: bold; 
    margin: 12px 0; 
    padding: 0; 
} 
#body .body .article h4 a { 
    color: #2a4f5e; 
    text-decoration: none; 
} 
#body .body .article h4 a:hover { 
    color: #507685; 
} 
#body .body .article p { 
    color: #2a4f5e; 
    font-size: 14px; 
    line-height: 22px; 
    margin: 0; 
    padding: 0; 
} 
#body .body .article p a { 
    color: #2a4f5e; 
} 
#body .body .article p a:hover { 
    color: #346b84; 
} 
#body .footer { 
    margin: 0 auto; 
    overflow: hidden; 
    padding: 0 0 15px 0; 
    width: 960px; 
} 
#body .footer div { 
    float: left;  
    margin: 0; 
    padding: 0; 
} 
#body .footer div ul { 
    margin: 0; 
    padding: 0; 
} 
#body .footer div ul li { 
    list-style: none; 
    margin: 0 0 15px; 
    padding: 0 0 15px; 
} 
#body .footer h3 { 
    color: #2a4f5e; 
    font-size: 14px; 
    line-height: 26px; 
    margin: 0 0 12px 0; 
    padding: 0; 
    text-align: justify; 
    text-transform: uppercase; 
} 
#body .footer h3 a { 
    color: #2a4f5e; 
    text-decoration: none; 
} 
#body .footer h3 a:hover { 
    color: #507685; 
} 
#body .footer .section { 
    padding: 0 10px; 
    width: 220px; 
} 
#body .footer ul li { 
    background: url(images/border-dashed.gif) repeat-x bottom left; 
} 
#body .footer ul li:last-child { 
    background: none; 
} 
#body .footer li p { 
    color: #5d5d5d; 
    font-size: 14px;  
    line-height: 20px; 
    margin: 0; 
    padding: 0; 
    text-align: justify; 
} 
#body .footer li p a { 
    color: #5d5d5d; 
    text-decoration: underline; 
} 
#body .footer li p a:hover { 
    color: #aeaeae; 
} 
#body .footer li span { 
    color: #aeaeae; 
    display: block; 
    font-size: 10px;  
    line-height: 16px; 
    margin: 5px 0 0; 
    padding:0; 
} 
#body .footer ul.news li p { 
    background: url(images/bullets.gif) no-repeat 0 8px; 
    padding: 0 0 0 15px; 
} 
#body .footer .featured { 
    padding: 0 18px 0 24px; 
    width: 438px; 
} 
#body .footer .featured ul li { 
    overflow: hidden; 
} 
#body .footer .featured img { 
    border: 1px solid #dbddde; 
    float: left; 
    margin: 0 20px 0 0; 
    padding: 1px; 
} 
#body .footer .featured p { 
    margin: 0; 
    padding: 0; 
} 
#body .contact, 
#body .about, 
#body .services, 
#body .blog { 
    margin: 0 auto; 
    padding: 25px 10px 50px 10px; 
    width: 940px; 
} 
#body h1 { 
    color: #2a4f5e; 
    font-size: 27px; 
    font-weight: bold; 
    height: 74px; 
    line-height: 74px; 
    margin: 0; 
    padding: 0; 
    text-indent: 10px; 
    text-transform: uppercase; 
} 
#body .contact p { 
    color: #7b7b7b; 
    font-size: 15px; 
    font-weight: bold; 
    line-height: 26px; 
    margin: 0; 
    padding: 40px 0;  
    text-align: justify; 
    width: 830px; 
} 
#body .contact p a { 
    color: #7b7b7b; 
} 
#body .contact p a:hover { 
    color: #2a4f5e; 
} 
#body .contact div { 
    margin: 0; 
    padding: 0 0 30px 0;  
} 
#body .contact div h3 { 
    color: #5d5d5d; 
    font-size: 14px; 
    font-weight: bold; 
    margin: 0; 
    padding: 0 0 5px 0; 
} 
#body .contact div ul { 
    margin: 0; 
    padding: 0 0 20px 0;   
} 
#body .contact div ul li { 
    color: #5d5d5d; 
    font-size: 14px; 
    list-style: none; 
    margin: 0; 
    padding: 5px 0; 
} 
#body .about div { 
    padding: 50px 0 0 0;  
} 
#body .about h2 { 
    color: #2a4f5e; 
    font-size: 16px; 
    font-weight: bold; 
    margin: 0; 
    padding: 0; 
    text-transform: uppercase; 
} 
#body .about p { 
    color: #5d5d5d; 
    font-size: 14px; 
    line-height: 24px; 
    margin: 10px 0 0; 
    padding: 0; 
    text-align: justify; 
    width: 830px; 
} 
#body .about p a { 
    color: #5d5d5d; 
} 
#body .about p a:hover { 
    color: #2a4f5e; 
} 
#body .services div { 
    overflow: hidden; 
    margin: 0; 
    padding: 40px 0 0; 
} 
#body .services h2 { 
    color: #2a4f5e; 
    font-size: 16px; 
    font-weight: bold; 
    line-height: 24px; 
    margin: 0; 
    padding: 0; 
    text-transform: uppercase; 
} 
#body .services h2 a { 
    color: #2a4f5e; 
} 
#body .services h2 a:hover { 
    color: #507685; 
} 
#body .services h3 { 
    color: #2a4f5e; 
    font-size: 14px; 
    font-weight: bold; 
    line-height: 24px; 
    margin: 15px 0 0; 
    padding: 0 30px 0 0; 
    text-transform: uppercase; 
} 
#body .services h3 a { 
    color: #2a4f5e; 
} 
#body .services h3 a:hover { 
    color: #507685; 
} 
#body .services h4 { 
    color: #2a4f5e; 
    font-size: 16px; 
    font-weight: normal; 
    line-height: 24px; 
    margin: 0; 
    padding: 0; 
    text-transform: uppercase; 
} 
#body .services p { 
    color: #5d5d5d; 
    font-size: 14px;  
    line-height: 24px; 
} 
#body .services p a { 
    color: #5d5d5d; 
} 
#body .services p a:hover { 
    color: #2a4f5e; 
} 
#body .services div ul { 
    float: left; 
    margin: 0; 
    padding: 20px 0 0; 
    width: 312px; 
} 
#body .services div ul li { 
    background: url(images/bullets.gif) no-repeat center left; 
    color: #5d5d5d; 
    font-size: 14px; 
    list-style: none; 
    margin: 0; 
    padding: 5px 0 5px 12px;  
    text-align: left; 
} 
#body .services div div { 
    overflow: hidden; 
    margin: 0; 
    padding: 0 0 5px 0; 
} 
#body .services div div img { 
    float: left;  
    padding: 0 10px 0 0; 
} 
#body .services div div p { 
    padding: 0 30px 0 0; 
    text-align: justify;  
} 
#body .products { 
    margin: 0 auto; 
    padding: 25px 0 70px 0; 
    width: 960px; 
} 
#body .products h2 { 
    color: #2a4f5e; 
    font-size: 26px; 
    margin: 0; 
    text-align: center; 
    text-transform: uppercase; 
    padding: 90px 0 30px 0; 
} 
#body .products p { 
    color: #5d5d5d; 
    font-size: 14px; 
    line-height: 24px; 
    margin: 0; 
    padding: 0 10px;  
    text-align: justify; 
} 
#body .products p a { 
    color: #5d5d5d; 
} 
#body .products p a:hover { 
    color: #2a4f5e; 
} 
#body .products div { 
    overflow: hidden; 
    margin: 0 0 45px 0; 
    padding: 0; 
} 
#body .products div div { 
    float: left; 
    margin: 0; 
    padding: 0 10px; 
    text-align: center; 
    width: 300px; 
} 
#body .products div div h3 { 
    color: #2a4f5e; 
    font-size: 16px; 
    line-height: 24px; 
    margin: 0; 
    padding: 0 0 10px 0; 
    text-align: justify;  
    text-transform: uppercase; 
} 
#body .products div p { 
    font-size: 16px;  
} 
#body .products div div p { 
    font-size: 14px; 
    margin: 0; 
    padding: 0; 
    text-align: justify;  
} 
#body .blog { 
    overflow: hidden; 
} 
#body .blog div { 
    float: left; 
    padding: 60px 0 0 0; 
    width: 630px; 
} 
#body .blog ul { 
    float: left; 
    margin: 0; 
    padding: 38px 0 0 30px; 
    width: 280px; 
} 
#body .blog ul li { 
    background: url(images/border-dashed.gif) repeat-x bottom left; 
    list-style: none; 
    margin: 0; 
    padding: 22px 0;  
} 
#body .blog ul li:last-child { 
    background: none; 
} 
#body .blog h2 { 
    color: #2a4f5e; 
    font-size: 16px; 
    margin: 0; 
    padding: 0; 
    text-transform: capitalize; 
} 
#body .blog h3 { 
    color: #5d5d5d; 
    font-size: 14px; 
    margin: 0; 
    padding: 0; 
    text-align: justify;  
} 
#body .blog h3 a { 
    color: #5d5d5d; 
} 
#body .blog h3 a:hover { 
    color: #2a4f5e; 
} 
#body .blog p { 
    color: #5d5d5d; 
    font-size: 14px; 
    line-height: 24px; 
    margin: 0; 
    padding: 0; 
    text-align: justify; 
} 
#body .blog p a { 
    color: #5d5d5d; 
} 
#body .blog p a:hover { 
    color: #2a4f5e; 
} 
#body .blog div p { 
    padding: 15px 0;  
} 
#body .blog div p.article { 
    font-weight: bold; 
} 
#footer { 
    background: #f5f5f5 url(images/bg-footer.gif) repeat-x top left;  
    margin: 0; 
    min-width: 960px; 
    padding: 0; 
} 
#footer div { 
    margin: 0 auto; 
    overflow: hidden; 
    padding: 26px 0 0; 
    width: 960px; 
} 
#footer div div { 
    float: left; 
    margin: 0; 
    padding: 0; 
    text-align: center; 
    width: 192px; 
} 
#footer div div h3 { 
    color: #818a8c; 
    font-size: 12px; 
    font-weight: bold; 
    margin: 0 0 5px 0; 
    padding: 0; 
    text-transform: uppercase; 
} 
#footer div div ul, 
#footer div div ul li { 
    margin: 0; 
    list-style: none; 
    padding: 0; 
} 
#footer div div ul li { 
    font-size: 12px; 
    line-height: 22px; 
    color: #818a8c; 
} 
#footer div a.facebook, 
#footer div a.twitter { 
    display: block; 
    float: left; 
    height: 27px; 
    margin: 10px 0 0; 
    text-indent: -99999em; 
    width: 40px;  
} 
#footer div a.facebook, 
#footer div a.twitter { 
    background: url(images/icons.gif) no-repeat;  
} 
#footer div a.facebook { 
    background-position: 0 0; 
    margin: 10px 0 0 58px; 
    _margin: 10px 0 0 28px; 
} 
#footer div a.twitter { 
    background-position: 0 -37px; 
} 
#footer div p { 
    color: #c1c1c1; 
    font-size: 12px; 
    margin: 0; 
    padding: 0 0 30px 0; 
    text-align: center; 
    text-shadow: 1px 1px 1px #fff; 
}

我的其他CSS覆蓋。

/* 
    Document : login 
    Created on : Nov 15, 2012, 2:15:26 PM 
    Author  : god-gavedmework 
    Description: 
     Purpose of the stylesheet follows. 
*/ 



.overlap{ 
    background:none; 
    height: 472px; 
    margin: 0 auto; 
    padding: 0; 
    width: 960px; 
} 
table 
{ 
    position:absolute; 
    width: 20%; 
    float: left; 

} 

.errorMessage { 
color: red; 
font-size: 0.8em; 
}

來源

2012-12-19 toksis

這兩個答案都是正確的，但我只能做一個檢查... – toksis

你能解釋你爲什麼投票嗎？我需要知道爲什麼......謝謝 – toksis

你可以嘗試使用可視性隱藏的方式，將採取相同的空間，但會無形

.overlap{ 
    background:none; 
    height: 472px; 
    margin: 0 auto; 
    padding: 0; 
    width: 960px; 
    visibility:hidden; 
}

來源

2012-12-19 04:07:54

背景：無; - >我的救星hehehe謝謝男人:) – toksis

知名度：隱藏;也需要... – toksis

#body .header #prodoverlap{ 
    background:none; 
    height: 472px; 
    margin: 0 auto; 
    padding: 0; 
    width: 960px; 
}

請在您的其他CSS文件由於添加此CSS代碼。

來源

2012-12-19 04:11:32

Thnaks background：none;工作:) – toksis

需要重疊CSS命令我需要刪除圖像背景。

回答

相關問題