大規模なHTML Webページの特定のdivタグをターゲットとするCSS

私の前のquestion hereとの関連で。以下のHTMLコードをウェブページの一部として使用している場合は、divタグがさらに多くなる可能性がありますが、CSSのこれらのdivをどのようにターゲットできますか？私が最もよく働くと思うサンプルは[This Answer] [2]です。大規模なHTML Webページの特定のdivタグをターゲットとするCSS

大規模なHTML DOMでdivをより選択可能にするためにId属性を追加しました...それらをより区別しやすくする方法がわかりません。そうするより良い方法があるなら、私に知らせてください。目標は、大規模な共有ポイントポータルサイト内の約6つのdivタグ要素にCSSデザインを適用することです。クールな一般的な方法があれば、簡単にセクションを追加して、将来このフォーマットを使用することができます...フォーマットされた各エレメントにクラス属性を追加できますが、わかりません構文

これを行うにはデザイナーのプロフェッショナルな方法がありますか？

<div id="projectName"> 
     Realtime Account Activiation 
</div> 

<div id="divAnnounce"> 
     Announcements 
</div>

は、私は以下のコードを使用しますが、全体横の長さが青ではなく、最初の文字です悪い結果を取得しています http://jsfiddle.net/eW532/1/

を持っています。私はhtml要素に2つのクラスを一緒に使用させようとしています。

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <style type="text/css"> 
     .even_spacing { color: purple; 
         background-color: #d8da3d } 

     .first_letter { background:blue; 
         color:white; 
         padding:4px 0px 4px 5px;}   
    </style> 

</head> 
<body> 
    <form id="form1" runat="server"> 

    <div class="first_letter even_spacing"> 
     Realtime Account Activiation 
    </div> 

    <div class="first_letter even_spacing"> 
     Announcements 
    </div> 
    </form> 
</body> 
</html>

出典

2011-02-07 kacalapy

をHTMLファイルに入れて、新しいスタイルシートを参照するページの上部に <LINK REL=StyleSheet HREF="Path/to/your/stylesheet.css" TYPE="text/css" MEDIA=screen>と入力します。あなたのCSSファイルのPUTで

：あなたが使用している場合

#projectName{ 
style:value; 
} 

#divAnnounce{ 

}

＃はID年代で物事を対象としています。それはクラス名を対象とします前に、

また、あなたはあなたが行うことができますあなたがdivAnnounceの内部に別のdivを持っている場合は

#idname.classname{ 

}

ような具体的な取得する必要がある場合は、両方を使用することができます

#divAnnounce #yournewdiv{ 

}

#divAnnounce div{ 

}

#newdivid{ 

}

お知らせ二つのターゲットは、彼らが親と子であることを言ってその間のスペース

出典

2011-02-07 18:23:35 Bill

CSS classesとselectorsを使用してください。

出典

2011-02-07 18:22:31 SLaks

<style> 
.class1 { 
style: value; 
} 

.class2 { 
style:value; 
} 
</style> 

<div class="class1" id="projectName"> 
     Realtime Account Activiation 
</div> 

<div class="class2" id="divAnnounce"> 
     Announcements 
</div>

詳細情報：あなたはIDのためのクラスのための.className表記と#IDName表記を使用する必要がClass vs ID selectors

出典

2011-02-07 18:24:06

：

.className { 
style:value; 
} 

#IDName { 
style:value; 
}

<div class="className">Test</div> 

<div id="IDName">Test</div>

出典

2011-02-07 18:25:10

-1

IDは一意であり、特定のページ要素を識別する目的を果たします。これは本当にあなたが探しているものを達成するための最良の方法です！スタイルを設定する

例：jQueryのイベントを設定

#projectName {width:100%;}

例：

$("#projectName").click(function() { alert('Clicked'); });

出典

2011-02-07 18:26:24 Zuul

否定の投票にいくつかのコメントを設定してください。そうでなければ、私の答えに間違いがないか分かりません。 – Zuul

私は、類似した問題の答えを書きました。

Load an external CSS for a specific DIV

私は、これはあなたを助けるべきだと考えています。

外部ファイルを読み込むためのレスポンスヘッダーでCSSファイルが常に "Access-Control-Allow-Origin"を返すことを確認してください。

CSSデータを別の方法でロードする場合は、applyCSSToHTML()機能を使用するだけです。

幸運を祈る！

出典

2013-08-15 12:23:12

大規模なHTML Webページの特定のdivタグをターゲットとするCSS

答えて

関連する問題