5

私は、html および Web コーディング全般に不慣れです。次のコードで、変数の前のピリオドは何を示していますか?

<style>
<!-- Modify these styles -->
.page_title       {font-weight:bold}
.page_text        {color:#000000}
</style>
... JS code

ありがとう

4

4 に答える 4

14

それらは変数ではありません。これらは CSS セレクターであり、例ごとにそのクラスを持つ HTML ノードを表します

<div class="page_title">Page Title</div>

CSS セレクターを使用して、HTML 内のこれらの要素のスタイルを設定します


彼らが提案したので。=)

CSS で HTML ノードを参照する方法はいくつかありますが、最も一般的なのは ID、クラス、およびタグ名です。

この例を見てください

<div>
    <ul id="first_set">
       <li class="item"> Item 1 </li>
       <li class="item"> Item 2 </li>
    </ul>
    <ul id="second_Set">
       <li class="item"> Item 1 </li>
       <li class="item"> Item 2 </li>
    </ul>
</div>

Ok。2 つの順序付けられていないリストを持つ div があり、各リストは 2 つのリスト項目であり、CSS:

div { background-color: #f00; } 
#first_set { font-weight: bold; }
#second_set { font-weight: lighter; }
.item { color: #FF00DA }

divセレクターは<div>HTML ページ内のすべての を選択します。# は ID を意味するため、#first_setこの場合はその ID を持つオブジェクトを選択します。

<ul id="first_set">

ドット記号はクラスを選択するため、.itemセレクターはアイテム クラスを持つすべてのオブジェクトを選択します。この場合、すべてを選択します。

<li class="item">

これは実際の基本にすぎません。これらのセレクターを組み合わせて、例ごとにより具体的にすることができます。

#first_set .item { text-decoration: underline; }

#first_set 内にあるクラス項目を持つオブジェクトのみを選択します。


一般に、ID (#myID で選択) は HTML ページで 1 回だけ使用する必要があり、クラスは複数の要素で使用できることに注意してください。さらに、要素は複数のクラスを持つことができます。スペースで区切るだけです。(例<li class="item special-item">) –プラチナ アズール

于 2010-12-29T17:29:08.040 に答える
0

これは、スタイル グループを CSS のクラスとしてマークすることです。@w3schools のチュートリアルを読んでください。これは本当に良いスターターです。

http://www.w3schools.com/css/default.asp

于 2010-12-29T17:28:49.173 に答える
0

通常、たとえば何かが属するクラス

.treeListContainer input

treelistcontainer はクラスであり、入力はクラス内のコントロールであるため、スタイルはそのクラス内のコントロールにのみ影響します

于 2010-12-29T17:30:23.267 に答える
0

あなたが話しているセクションは、HTML に埋め込まれた CSS です。CSSにも HTML にも変数はありません。

ドット プレフィックスは、それがクラス セレクターであり、指定されたクラスのメンバーである HTML 要素と一致することを示します。

要素をクラスのメンバーにするには、 class 属性の値として指定されたスペース区切りのリストにクラス名を追加します。

したがって.page_title、要素は次のように一致します。

class="foo page_title bar baz"

ただし、一般的に言えば、「page_title」などのクラス名を付けたものはすべてメインの見出しと同じである可能性が高いため、HTML は通常次のようになります。

<h1>Main heading goes here</h1>

そしてCSS:

h1 { … }

なお、<!-- Modify these styles -->は HTML (および HTML 互換の XHTML) のエラーです。CSS コメントは と で区切られ/*ます*/

于 2010-12-29T17:41:38.067 に答える