2012-09-07 93 views
2

我想覆蓋struts/xhtml/style.css中提供的一些樣式。其中之一是標籤風格。 在struts/XHTML/style.css的標籤類的定義如下在線23:如何覆蓋xhtml主題css?

.label { 
    display: block; 
    margin: auto; 
    margin-bottom: 5px; 
    text-align: left; 
    color: #333; 
    font-size:12px; 
    width:150px; 
    font-style:normal; 
} 

但我:

.label { 
    font-style: italic; 
} 

在我的風格文件,我用下面的類重新定義標籤樣式標籤總是以斜體表示,當我使用調試工具時,我發現它採用xhtml屬性,並且不會覆蓋該屬性。這裏是我的完整的css文件:

/* Reset des properties */ 
html, body, div, span, applet, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, 
del, dfn, em, img, ins, kbd, q, s, samp, 
small, strike, strong, sub, sup, tt, var, 
b, u, i, center, 
dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td, 
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary, 
time, mark, audio, video { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    font-size: 100%; 
    /*font: inherit;*/ 
    vertical-align: baseline; 
} 
/* HTML5 display-role reset for older browsers */ 
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section { 
    display: block; 
} 
body { 
    line-height: 1; 
} 
ol, ul { 
    list-style: none; 
} 
blockquote, q { 
    quotes: none; 
} 
blockquote:before, blockquote:after, 
q:before, q:after { 
    content: ''; 
    content: none; 
} 
table { 
    border-collapse: collapse; 
    border-spacing: 0; 
} 

/*Definition des properties pour le projet OCC*/ 
/*tags html*/ 
body{ 
    margin: auto; 
    padding:auto; 
    align:center; 
    width:995px; 
    font-family:Arial,"Times New Roman", Times, serif; 
    font-size:12px; 
} 

h1{} 
h2{} 
p{ 
margin-top:20px; 
margin-bottom:20px; 
} 
li a { 
font-weight:bold; 
margin: 50px 0 ; 
padding:5px; 
} 
/*div*/ 

#content{ 
    margin: 20px 10px 20px 10px; 
    text-align:justify; 
    border:1px solid #000; 
} 
#header{ 
    border:1px solid #000; 
    margin:20px 0 0 0; 
    overflow:hidden; 
} 


#headerButton{ 
    background-color:#6993C9; 
    color:#ffffff; 
    font-weight:bold; 
    padding: 5px 15px; 
    height:2px; 
    width:auto; 
    padding: 7px 10px 34px 10px; 
} 

#headerButton a:link:first-child{ 
    color:#ffffff; 
    margin: 0 0 0 10px; 
} 
#headerButton a:link{ 
    color:#ffffff; 
    margin: 0 10px 0 0; 
    text-decoration:none; 
    font-size:11px; 
} 
#headerButton a:hover:first-child{ 
    color:#e6e6e6; 
    margin: 0 0 0 10px; 
} 

#headerButton a:hover{ 
    color:#e6e6e6; 
    margin: 0 10px 0 0; 
    text-decoration:none; 
} 
#imageOrange24{ 
margin:0 5px -10px 0; 
padding: 0 0 0 0; 

} 

#formWrapper{ 
margin:50px auto 50px auto; 
padding:50px 50px 50px 50px; 
width:300px; 
} 



#formWrapper tr{ 
margin: 0 0 10px 0; 
} 
#wwFormTable tr{ 
margin: 0 0 10px 0; 
} 

#menu{ 
    float:left; 
    width:125px; 
    height:200px; 
    margin: 20px 10px 20px 10px; 
    border:1px solid #000; 
} 

#adminMessageBox{ 

    float:left; 
    border: 2px blue solid; 
    width:400px; 
    height:200px; 
    margin: 20px 10px 20px 10px; 
    border:1px solid #000; 

} 
#waitingActionBox{ 
    float:right; 
    border: 2px blue solid; 
    width:400px; 
    height:200px; 
    margin: 20px 10px 20px 10px; 
    border:1px solid #000; 

} 

/*div englobant la liste des brochures*/ 
#listeBrochures{ 

} 

#search{ 
margin:0 0 20px 10px; 
} 
#dateCreation{ 

    margin: 0 0 0 5px; 
} 
/*classes*/ 
.fontGeneralTitle{ 
    float:left; 
    display:block; 
    font-size:24px; 
    font-weight:bold; 
    color:#6993C9; 
    padding: 20px 0 0 0; 
    margin: 0 0 0 30px; 
} 
.formLogin { 
    font-family: Arial,Verdana, Helvetica, sans-serif; 
    border: 1px solid #ccc; 
    width: 200px; 
    margin: auto; 
    margin-top: 100px; 
    text-align: center; 
    -moz-border-radius: 70px 10px; 
    padding: 10px; 
} 
.inputs { 
    display: block; 
    margin: auto; 
    margin-bottom: 15px; 
    border: 1px solid #ccc; 
    color: #333; 
} 

.label { 
    display: block; 
    margin: auto; 
    margin-bottom: 5px; 
    text-align: left; 
    color: #333; 
    font-size:12px; 
    width:150px; 
    font-style:normal; 
} 

.boutonLogin { 
    margin-top: 15px; 
    background-color:#f79646; 
    color:#ffffff; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    -khtml-border-radius: 5px; 
    behavior: url(/css/rounded/border-radius.htc); 
    border-radius: 5px; 
} 

.tdLabel{ 

} 


.boxTitle{ 
    width:100%; 
    font-weight:bold; 
    color:blue; 
    text-align:center; 
    margin:10px 0; 
    text-decoration:underline; 
} 

.auteur{ 
    float:right; 
    color:black; 
    font-weight:bold; 
    margin-right:10px; 
} 
.center{ 
    text-align:center; 
} 

.alignleft{ 
    float:left; 
    margin:20px 0 50px 10px; 
} 
.alignright{ 
    margin:20px 100px 0 0; 
} 

.bold{ 
    font-weigth:bold; 
    line-height:1; 
} 
.clear{ 
    float:clear; 
} 
.floatLeft{ 
    float:left; 
} 
.floatRight{ 
    float:right; 
} 

這是我生成html形式:

<div id="formWrapper"> 

     <form id="LoginAction" name="LoginAction" action="/OCC/LoginAction.action" method="post"> 
<table class="wwFormTable"> 
      <tr> 
    <td class="tdLabel"><label for="LoginAction_login" class="label">Identifiant: /label></td> 
    <td 
><input type="text" name="login" size="20" value="" id="LoginAction_login" class="inputs" title="Entrer votre identifiant"/></td> 
</tr> 

      <tr> 
    <td class="tdLabel"><label for="LoginAction_password" class="label">Mot de passe:</label></td> 
    <td 
><input type="password" name="password" size="20" id="LoginAction_password" class="inputs" title="Entrer votre mot de passe"/></td> 
</tr> 

      <tr> 
    <td colspan="2"><div align="right"><input type="submit" id="LoginAction_0" value="Valider" class="boutonLogin" title="Cliquer pour se connecter"/> 
</div></td> 
</tr> 

     </table></form> 

感謝您的幫助

+0

關於重寫的Struts文檔在這裏:http://struts.apache.org/2.2.1/docs/struts-2-themes.html。我想念什麼? – Pracede

+0

如果它給你帶來太多麻煩,那就去簡單的主題,你可以自由使用你的CSS作爲我們自己的方式 –

+0

你在哪裏/如何包括你的CSS?換句話說,''部分是什麼樣的?你是否以合理的順序包含你的CSS? –

回答

4

你有沒有試過?:

.label { 
    display: block; 
    margin: auto; 
    margin-bottom: 5px; 
    text-align: left; 
    color: #333; 
    font-size:12px; 
    width:150px; 
    font-style:normal !important; 
} 

重要!註釋應該重寫樣式。

+0

謝謝你jedrus07.It的作品。我以前不知道這個屬性。我是CSS新手。 – Pracede