クラスセレクターで 2 つのクラス値を同時に呼び出す方法_html/css

クラスセレクターで 2 つのクラス値を同時に呼び出す方法_html/css_WEB-ITnose

WBOY

リリース： 2016-06-24 11:57:38

オリジナル

1840 人が閲覧しました

＆lt;＆lt; lt;

<--2行目--> tr class="ファンシー">

理由を教えてくださいテーブルの th 部分の色は変わっていませんが、td 部分だけが変わりました。クラスセレクターで 2 つのクラス値を同時に呼び出す方法

ディスカッションへの返信 (解決策)

クラスセレクターの th 部分も機能させる方法

.fancy th{ color:#f60;background:#666;}
.fancy td{ color:#f60;background:#666 ;}
=》Change以下へ。それはクラス .table の th td であるため
.table .fancy th{ color:#f60;background:#666;}
.table .fancy td{ color:#f60;background:#666;}

.fancy th{ color:#f60;background:#666;}
.fancy td{ color:#f60;background:#666;}
=》以下に変更します。それはクラス .table の th td であるため
.table .fancy th{ color:#f60;background:#666;}
.table .fancy td{ color:#f60;background:#666;}

まだ動作していますが、ヘッダー部分の色は変わりません。さらに聞きたいのですが、.table はデフォルトのクラスセレクターで、空想などで名前を付けて定義していない場合でも、.table を宣言せずに直接使用することはできますか? @kongwei521

.fancy th{ color:#f60;background:#666;}
.fancy td{ color:#f60;background:#666;}
=》以下に変更します。クラス .table の th td なので
.table .fancy th{ color:#f60;background:#666;}
.table .fancy td{ color:#f60;background:#666;}

4 階質問は理解できましたが、宣言したテーブルクラスのことを忘れていました。しかし、問題はヘッダー部分がまだ変更されていないことです。なぜですか?解決してください。

我把你的代码删减如下样子：

名前	性別	名	張鳳	19
女性	18

姓名	性别	年龄	名族
张峰	男	19	汉族
李惠	女	18	回族

依旧能让th部分变色：

但我自己写的同样的代码，却还是不能改变：

真搞不懂

真搞不懂

你少了这个吧

真搞不懂

你少了这个吧

加上了也不行，chrome和IE浏览器都不行,这是我的代码：

<!DOCTYPE html><html><head>    <style>         <!--类选择器-->        .table .fancy th { color:#f60; background:#666; }        .table .fancy td { color:#f60; background:#666; }        .table { border:1px dotted #000; }    </style></head><body>        <form>            <table class="table" border="1">                 <!--第一行-->                 <tr class="fancy" >                     <th>姓名</th>                     <th>性别</th>                     <th>年龄</th>                     <th>名族</th>                 </tr>                 <!--第二行-->                 <tr class="fancy">                     <td>张峰</td>                     <td>男</td>                     <td>19</td>                     <td>汉族</td>                 </tr>                 <!--第三行-->                 <tr class="fancy">                     <td>李惠</td>                     <td>女</td>                     <td>18</td>                     <td>回族</td>                 </tr>            </table>		</form></body></html>

ログイン後にコピー

你直接复制粘贴运行看结果如何，反正我机子上不行，纠结。。。

//html
=》
を /*Class Selector*/ に変更します

とにかく、結果を確認するには、コピーして貼り付けて実行するだけです。私のマシンでは動作しません。。。

//html
=》
のコメントを /*Class Selector*/ に変更します

コピーして貼り付けて実行すると、結果がわかります。とにかく、私のマシンではそれができず、混乱しています。。。

//html コメント
=》
を /*Class Selector*/ に変更します

CSS 内のコメントは /*Comment content*/ の形式を使用する必要があります。以前見たことがあって、外部 CSS でのみ使用されているものだと思っていたので、気に留めていませんでした。ありがとうございます。