web-dev-qa-db-ja.com

CSSを使用してDIVのフォントサイズを上書きする

DIVに、データベースから読み込まれるtext/htmlコードを配置します。このテキストには、フォントサイズの定義が含まれている場合があります(例:font size = "3")。 CSSを使用してこの特定のDIVでこのフォントサイズをオーバーライドする方法はありますか?.

助けてくれてありがとう。

7
Sascha C

次のようなマークアップを想定しています。

<div>
    <font size="1">Some text at 'size="1"'</font> and natively-sized text, with more at <font size="26">'size="26".'</font>
</div>​

次に、CSSに親要素からinheritfont-sizeを明示的に指示できます。

div {
    font-size: 1.5em;
}
div font {
    font-size: inherit;
}

JS Fiddle demo

もちろん、fontは非推奨であるため、使用しないでください(要素のサポートが予告なしに停止したり、実装が警告なしに変更されたりする可能性があるため)。

ちなみに、!importantは宣言に通常のスタイルのカスケードをオーバーライドするように強制しますが、ナットを割るには大ハンマーが必要です。そして、それを回避できる場合(そしてこの場合、回避できる回避できるようです)、後でスタイルのデバッグを複雑にするため、回避する必要があります。 、および関連する継承の問題。

さらに、これはあなたの問題の症状を治療しています。あなたが実際に直面している問題は、コンテンツ/データベースにfontタグが存在することです。これは、要素を削除し、emspanなどの適切なスタイルの要素に置き換えることで修正する必要があります。

参照:

11
David Thomas

CSS!important 表記を使用して、div内で定義されたフォントサイズを上書きするようにブラウザに指示します。

上記のリンクから次のようになります:

ただし、バランスをとるために、「!important」宣言(区切り文字トークン「!」とキーワード「important」が宣言の後に続く)が通常の宣言よりも優先されます。

これを参照してください working Fiddle 例!

.htmlContents * {font-size:10px!important;}

<div class="htmlContents">my database html content</div>
5
Zuul

1つのアイデア:これらのテキストタグにIDまたはクラスを指定し、JavaScriptを使用してこれらの要素を検索し、それらのスタイルを変更します。

0
Viele

Divに挿入する前に、テキストから「font」タグを削除するのはどうですか?次に、フォントサイズでdivのスタイルを設定します。

0
yujust