Come sovrascrivere la proprietà css?

Ho provato a utilizzare jquery, ma non è stato possibile sovrascrivere la proprietà width della classe .gridHeader.Come sovrascrivere la proprietà css?

Mi piacerebbe correggere (diciamo 100px) la larghezza della prima colonna nella tabella.

<html> 
    <head> 
     <style> 
      html, body { 
       font-family:Tahoma; 
       font-size:11px; 
      } 
      .grid { 
       border-left:1px solid #CCCCCC; 
       border-top:1px solid #CCCCCC; 
      } 
      .gridHeader { 
       background-color:#EFEFEF; 
       border-bottom:1px solid #CCCCCC; 
       font-weight:bold; 
       height:20px; 
       padding-left:3px; 
       text-align:left; 
       width:100%; /* problematic, that I cannot change*/ 
      } 
      table.grid > tbody > tr > td { 
       border-bottom:1px solid #CCCCCC; 
       border-right:1px solid #CCCCCC; 
       padding:3px; 
      } 
     </style> 
     <script src="http://code.jquery.com/jquery-latest.min.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function(){ 
       $(".gridHeader").css("width",""); 
      }); 
     </script> 
    </head> 
<body> 
    <table width="100%"> 
     <tr> 
      <td class="gridHeader" style="width:100px">Vikas 
      </td> 
      <td class="gridHeader">Vikas Patel Vikas Patel Vikas Patel 
      </td> 
      <td class="gridHeader">Vikas Patel Vikas Patel 
      </td> 
     </tr> 
     <tr> 
      <td>Vikas 
      </td> 
      <td>Vikas Patel Vikas Patel Vikas Patel 
      </td> 
      <td>Vikas Patel Vikas Patel 
      </td> 
     </tr> 
    </table> 
</body> 
</html>

fonte

2010-10-14 Vikas

è necessario rimuovere lo stile in linea con removeAttr e quindi utilizzare il metodo css() in questo modo:

$(".gridHeader").removeAttr('style').css("width","100px");

Se si desidera applicare la larghezza solo prima colonna, è possibile utilizzare il filtro :first selettore come questo:

$(".gridHeader:first").removeAttr('style').css("width","100px");

fonte

2010-10-14 05:25:49 Sarfraz

La tua risposta è corretta, ma l'effetto non è esattamente quello che voglio, vedere la larghezza effettiva se ho impostato 500px per prima colonna. – Vikas

@Vikas: puoi impostare qualsiasi larghezza usando il metodo 'width' come mostrato. – Sarfraz

L'ho terminato, sostituendo la larghezza di tutte le colonne. grazie .. – Vikas

Funziona bene per me? A meno che non capisca il tuo "problema".

Check: http://www.jsfiddle.net/YjC6y/21/

fonte

2010-10-14 05:29:46 jAndy

È perché ho impostato "" come nuova larghezza, se l'ho impostato "100px" allora funziona, interessante? perché? – Vikas

Se si volesse ignorare il CSS in linea, si può avere la fortuna di farlo in questo modo:

style="width:100px !important;"

fonte

2010-10-14 05:33:39 Shawn

Hai provato nel mio codice? In firebug, sembra che lo escludiamo, ma l'effetto non è esattamente quello che voglio, guarda la larghezza effettiva se imposto 500px. – Vikas

immagino il problema non è la prima colonna, ma gli altri, mentre hanno ancora il 100% applicato.

$(".gridHeader").css("width","");

... non funzionerà, perché non è stato impostato un valore legale.

Prova questo:

$(".gridHeader").not(':first-child').css("width","auto");

fonte

2010-10-14 05:47:19

Vecchio post, ma mi hai salvato la pelle. – Adam

Come sovrascrivere la proprietà css?

risposta

Problemi correlati