10

私は CSS の専門家ではありませんが、サイトのフォント サイズを大きくするというタスクがあります。このサイトでは、ダウンロードした CSS テーマを使用しています。ご覧のとおり、フォントの定義を含む単一のファイル main.css があります。他の css ファイルでは、font-size はパーセンテージを使用して設定されます。

font-sizeただし、 main.css 自体の単語には 102 の一致があります。

 body { font-size: 13px; }
 h1 { font-size: 32px; }
 h1.smaller { font-size: 31px; }
 h2 { font-size: 26px; }

等々。

font-size の値を抽出$1して に置き換えるスクリプトを作成することを考えてい$1+1ます。

しばらくすると、おそらくもっと洗練されたソリューションがあるでしょうか? CSS自体を使用して、何らかの方法でフォントサイズを再定義できますか?

4

1 に答える 1

8

次の PHP スクリプトを使用して、すべてのfont-size: [0-9]+px値をに変換しましたem。

<?php

$filename = "MyCss.css";

$css = file_get_contents($filename);

$css = preg_replace('/font-size\s*\:\s*([0-9]+)\s*px/ie', '"font-size: " . ($1/16) . "em"', $css);

file_put_contents($filename, $css);

上記の例の CSS は次のようになりました。

body { font-size: 0.8125em; }
h1 { font-size: 2em; }
h1.smaller { font-size: 1.9375em; }
h2 { font-size: 1.625em; }

baseline次に、HTML 要素に font-size を設定することをお勧めします。

html { font-size: 16px; }

次に、ページ上のすべてのフォント サイズにグローバルに影響を与えたい場合は、この単一の値を変更すると、em単位を使用するすべてのフォントがスケーリングされます。

必要に応じてパーセンテージを使用することもできますemが、通常は が好まれます。

(申し訳ありませんが、Ruby は私が知らない数少ない言語の 1 つです)

于 2013-09-10T14:01:35.860 に答える