9

<head> で <style> 要素を使用せずに、親のスタイル内から子ノードのスタイルを設定することは可能ですか?

たとえば、行 (下の最初の行) があるテーブルがあり、TD 要素内のすべてのテキストのフォント サイズを 7pt にしたいとします。

何かのようなもの：

  <テーブル>
    <tr style='font-size:7pt;'> <--- 子 TD 要素に適用するように指示するにはどうすればよいですか
      <td>セル 1 は 7pt フォントにフォーマットする必要があります</td>
      <td>セル 2 は 7pt フォントにフォーマットする必要があります</td>
    </tr>
    <tr>
      <td>フォーマットなしのセル</td>
      <td>書式なしの別のセル</td>
    </tr>
  </表>

ありがとう、グラント

4

5 に答える 5

3 
<table>
<tr class="format">
  <td>cell 1 should be formatted to 7pt font</td>
  <td>cell 2 should be formatted to 7pt font</td>
</tr>
<tr>
  <td>cell without format</td>
  <td>another cell without format</td>
</tr>


<style>.format>td{font-size:7pt;}</style>
于 2012-07-05T14:39:05.067 に答える
1

scoped次のようなスタイルを宣言することでそれを行うことができます：

  <table>
    <tr>
    <style scoped>  <--- "scoped" tells the browser to apply the styles inside the tr
        {your-selector}{             
            {styles}
        }
    </style>
      <td>cell 1 should be formatted to 7pt font</td>
      <td>cell 2 should be formatted to 7pt font</td>
    </tr>
    ...
  </table>

ただし、これに対する Browsersupport はひどい atm です。

Html5Doctorの記事を読んでください。これは非常に興味深いものであり、ブラウザがサポートするまで使用できるポリフィルが存在します。

編集：

最新の FF、Chrome、および Opera が現在サポートしているようです: HTML5Rocks の記事

于 2012-07-05T14:47:32.320 に答える
0

直接はできません。それでもインライン スタイルを使用する場合は、JavaScript を使用して各要素のスタイルを設定する必要があります。繰り返しますが、それは良い解決策ではありません

有効な方法は --> 以下は IE7 と UP & 他のすべてのブラウザで動作します

<style>
table tr:first-child > td {font-size:7pt;}
</style>

おそらく、テーブルにクラス名を付けたいと思うでしょう。

于 2012-07-05T14:42:10.467 に答える
0

子要素に対してはできません。

style 属性は、要素のインライン スタイルを指定します。（ソース）

jQuery を使用して、必要なことを行うことができます。

<script>
$("tr:first-child td").attr("style", "font-size:7pt");
</script>
于 2012-07-05T14:43:12.650 に答える
-2

いいえ、そうではありません。これはまさに style タグの目的です :-) ところで、インライン スタイルは避けるようにしてください。

于 2012-07-05T14:38:19.043 に答える