IDなしでスタイリング用のテーブルを選択するにはどうすればよいですか？

Question

私は、Volusionのサイトを設計し、スパンIDのない表をスタイル付けしようとしています。表はVolusionから自動的に生成されるため、スパンIDは追加できません。私はCSSに入り、無駄にすべてを試しました。ここでは、現在のコードの小さなスニペットです：

<table border="0" cellspacing="1" cellpadding="3" bgcolor="#CCCCCC"> 
<tr class="colors_backgroundlight"> 
<td>Item#</td> 
<td>Item Name</td> 
<td><span class="PageText_L335n"><b>Starting at</b></span></td> 
<td><span class="PageText_L71n">Qty</span></td> 
<td><b><span class="PageText_L337n">Add</span></b></td> 
</tr> 
<tr bgcolor="#FFFFFF" class="Multi-Child_Background"> 
<td class="smalltext colors_text">NFBM665-S</td> 
<td class="productnamecolorSMALL colors_productname">Foil Thermal Bubble Mailer, 6" x 6.5" Sample</td> 

は残念ながら、ページ上の他のテーブルがありますので、私は何をすべきか見当がつかない。この特定のテーブルをターゲットにできるJavaScriptコードはありますか？何か助けてくれてありがとう。

Answer 1

JavaScriptで表を分離するのと同じ問題が、CSSの場合と同じです。

CSSスタイルは、id以外のさまざまなものに基づいて適用できます。 DOMのテーブルの相対的な位置（静的な場合）は私の次の選択肢になります。

シナリオ内のDOMに基づいて、あなたが従うtableの兄弟であるspan要素があります。そのspanは、idがproduct_descriptionであり、ドキュメント内で一意になります。

#product_description ~ table { background:yellow; } 
 

 
#product_description ~ table td { padding:25px; }

<span id="product_description" itemprop="description"> 
 
Please Note: For Thermal Bubble Mailer samples, we charge $5.95 for shipping and handling for each sample.<br /> 
 
1 sample per item, per customer. Coupon codes cannot be applied to samples.<br /><hr /> 
 
</span> 
 
<br /><br /> 
 
<div style='height: 15px;'></div> 
 
<div style='clear: both;'></div> 
 

 
<table border="0" cellspacing="1" cellpadding="3" bgcolor="#CCCCCC"> 
 
    <tr class="colors_backgroundlight"> 
 
    <td>Item#</td> 
 
    <td>Item Name</td> 
 
    <td><span class="PageText_L335n"><b>Starting at</b></span></td> 
 
    <td><span class="PageText_L71n">Qty</span></td> 
 
    <td><b><span class="PageText_L337n">Add</span></b></td> 
 
    </tr> 
 
    <tr bgcolor="#FFFFFF" class="Multi-Child_Background"> 
 
    <td class="smalltext colors_text">NFBM665-S</td> 
 
    <td class="productnamecolorSMALL colors_productname">Foil Thermal Bubble Mailer, 6" x 6.5" Sample</td> 
 
    </tr> 
 
</table>

Answer 2

あなたは全体のhtmlページでテーブルを投影する兄弟や親要素（先祖）IDで行くことができます。以下はspanは次の兄弟要素としてテーブルを拾うでしょう。

クロムブラウザを使用している場合は、テーブル要素を調べ、右クリックしてセレクタをコピーします。そして、このセレクタのCSSを定義します。このセレクタは、HTMLページ全体で一意にテーブルを定義します。

注：：そのHTMLページに固定数の表がある場合は、表の索引付けを行うのが簡単で簡単です。

Answer 3

あなたは例えば、ID以外の他の属性を持つ要素を選択することができます。

table[bgcolor="#CCCCCC"] 

たり、チェーンより多くの属性することができます

table[bgcolor="#CCCCCC"][border="0"] 

続きを読む：http://www.w3schools.com/css/css_attribute_selectors.asp