0

誰かが教えてくれるかどうか疑問に思っていました。Web サイトに CSS があり、各ページのページ上部で同じプロパティ (クラス) を使用したいと考えています。残りのページでは異なるクラスを使用します。たとえば、Page1、Page2、Page3 があるとします。それらはすべて「Welcome to my site」ラベルに同じ CSS クラスを使用しますが、そのラベルを除いて、各ページは異なるデータを表示し、異なるクラスを使用します。したがって、ページ 1 からページ 3 に移動するたびに、同じ CSS を呼び出し続けます。

私の質問は、効率的かつ純粋に、何をするのが最善かということです:

1.各ページで同じクラスを再度呼び出します。

2.ページの先頭にスタイルを設定して、毎回 CSS を呼び出さないようにします。

3.残りのページには iframe を使用します。

4.私が言及しなかった別の方法。

--編集後--

最高、デビッド

4

3 に答える 3

4

何が必要かはわかりませんが、ページ全体で共通のCSSが必要な場合は、CSSリンクが役立ちます。

<link rel="stylesheet" type="text/css" href="myStyles.css"/>

これらはページに好きなだけ入れることができるので(それらは入る<head>必要があります)、CSSを好きなだけ多くのファイルに分割することができます。また、これにより、視聴者はCSSファイルをキャッシュできるため、毎回ダウンロードする必要がなくなります。

例:

SuperLabel.css

.superLabel
{
    color: red;
    font-weight: bold;
    margin: 50px;
}

Page1.html

<!DOCTYPE html>
<html>
    <head>
        <title>Page 1</title>
        <link rel="stylesheet" type="text/css" href="SuperLabel.css"/>
        <link rel="stylesheet" type="text/css" href="page1.css"/>
    </head>
    <body>
        <div class="superLabel">I'm FABULOUS!</div>
        ... the rest of content ...
    </body>
</html>

Page2.html

<!DOCTYPE html>
<html>
    <head>
        <title>Page 1</title>
        <link rel="stylesheet" type="text/css" href="SuperLabel.css"/>
        <link rel="stylesheet" type="text/css" href="page2.css"/>
    </head>
    <body>
        <div class="superLabel">I'm fabulous AGAIN!</div>
        ... the rest of content ...
    </body>
</html>
于 2012-05-10T07:20:01.680 に答える
1

私があなたの質問を理解しているかどうかは完全にはわかりませんが、読み込み時間を改善するためにヘッダーCSSを本体の残りの部分から分離することを意味しますか?それがあなたの質問なら、私はそれが必要だとは思いません。それはそれほど重くはなく、ユーザーのブラウザは通常それをキャッシュし、最後の訪問以降に変更されたかどうかをチェックします。

于 2012-05-10T07:23:55.607 に答える
0

iframeを使用する必要はありません。bodyタグにもクラスを含めることができます。

Page1クラス「style1」の本文とPage2クラス「style2」の本文を指定すると

<span class="welcome">Welcome to my site</span>

そしてcssは

.style1 .welcome { color:red; }
.style2 .welcome { color:blue; }

Page1の「ウェルカムメッセージ」のテキストの色は赤になり、Page2の「ウェルカムメッセージ」のテキストの色は青になります。

これはあなたが望むことでしょう。

于 2012-05-10T07:46:14.380 に答える