通常、ページ固有のCSSが埋め込まれています。ここで私は自分のCSSを行う方法です。
グローバルCSS(別々のファイル(複数可)):
<link type="text/css" rel="stylesheet" href="css/style.css" media="all" />
注:私たちはプラグイン/テーマとこれらのプラグインのトンを使用して、今日のウェブの世界では/themesは新しいバージョンを展開する傾向があるので、これらのプラグイン/テーマを上書きするときは、そのテーマに固有のCSSファイルを作成してください。例えば
、
ブートストラップ3.1
<link href="/css/bootstrap.3.1.css" rel="stylesheet" type="text/css">
それが出て来るときあなたは最新バージョンを使用できるように、すべてのブートストラップ・オーバーライドのためにこれを作成します。
<link href="/css/bootstrap.overrides.css" rel="stylesheet" type="text/css">
ページ固有のCSS(埋め込み):
<head>
<!-- last element in head //-->
<style type="text/css">
.pageSpecific
{
color: red;
}
</style>
</head>
私は、開発段階で午前またはhtml要素は、CSSの分類を必要としないとき。
シンプルなスタイルのフォーマット(インライン):
<th style="min-width: 65px;">Column Header</th>
あなたにもプリント特定のCSSを持っていることがあります。
<link href="/css/print.css" rel="stylesheet" type="text/css">
と、このファイル内のようなあなたのCSSをラップ:
@media print{
<!-- print specific css here//-->
}
CSSの分類は後で、ページ固有のように見えるかもしれません。再利用性のために常にコーディングしてください!最後に
は:
私は生産に私のファイル(複数可)を入れcss minifierを使用したいです。私はUglyJsを使ってjavascriptファイルと同じことをします。あなたが使うことができるLESS CSSもありますが、今のところ私はこれらの単純な慣習に似ています。
なぜ 'media = all'を使用していますか?これにはまったく理由がありません。あなたのCSSは、なぜ軽いリーダーに送られる必要がありますか?または印刷する?なぜ 'media = screen、tv、projection'を使うのではなく、見ることができるCSSにとって本当に便利なのでしょうか? (はい、私は 'tv'と' projection'がバリデーションエラーを返すことを知っています - バリデーションがキオスクモード、フライングLCD、そして "スクリーン"に従わない他のスクリーンのことを忘れているようだから) 。 – junkfoodjunkie
'@media screen'の代わりにこれを使用する場合のペナルティは何ですか?私は自分のcssを自分のプリントCSSに持ち帰り、必要に応じて '@media print'ルールでオーバーライドします。私は 'screen、print'を置くことができると思いますが、もう一度、ペナルティは何ですか? – yardpenalty
ペナルティはありませんが、通常、画面に使用されるCSSの多くは印刷物には含まれていません。通常は、完全に別のprint.cssが使用されます。これは、通常のWebページには何も印刷されていないコンテンツ(ページをカバーする背景画像など)がたくさんあるためです。書式設定は、画面や印刷ページ、その他の項目を非表示にしたり、強調したりする場合にはあまり効果的ではありません。それは当然問題のサイトに少し依存しますが、ほとんどの場合、スクリーンCSSは印刷で役に立たず、その逆もあります。 – junkfoodjunkie