ＣＳＳについて初歩的な質問です

解決済

質問者：kiokio5893
質問日時：2014/01/04 15:08
回答数：4件

ＣＳＳについて初歩的な質問です。表現は我流ですがｌｉの親はｕｌそれをも含むのがｄｉｖと解釈していますが問題ないですか？ｌｉ＜ｕｌ＜ｄｉｖ

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (4件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： cobaltlight
回答日時：2014/01/04 15:36

liの親はulというのは合っています。

でもulをも含むのがdivかというと、ちょっと違うように思えます。
なぜならliはulに含まれる必要がありますが、
ulはdivなしで使えるものだからです。

色々なサイトのソースコードを見ると、
ほぼ間違いなくdivの中にulが含まれています。
でもそれはcssを設定しやすいというデザイン上の理由からであって、
ulはdivなしでも機能しますし構造上も間違っていません。

ulとdivに親子の関係はなく、どちらも対等の関係です。

- 0
- 件

通報する

この回答へのお礼

有難うございます

通報する

お礼日時：2014/01/04 16:33

No.4

回答者： ORUKA1951
回答日時：2014/01/04 16:04

我流じゃ決して上達しません。

泥沼にはまるだけです。
　スタイルシートのセレクタ・・スタイルを適用したい要素を指定する選択肢・・・は、HTMLの文書構造に従います。
　要素:HTMLは、タグを用いてその文書を構成する要素をマークアップする言語です。
　　例) <h1>この文書の第一レベルの見出し</h1>
　　　<div class="nav">この部分はナビゲーション要素</div>
　　　このようにDIVは、idやclass名を併用して文書構造を示す目的で使用されます。
　　『id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )』
　※DIVはデザインのためじゃないです!!!とってもたくさんの人が間違って理解している。

例えば、その文書のli要素の構造が
<body>
　<div class="header">
　　<div class="nav">
　　　<ol>
　　　　<li>★</li>
　　　　・・・
　　　</ol>
　　</div>
　</div>
　<div class="section">
　　・・・
　　<ol>
　　　<li>☆</li>

でしたら、
　★☆はリストの項目要素の内容で、文書構造は
html
|-- body
　　　|-- div　　.header
　　　|　　　|-- div　　　.nav
　　　|　　　　　　|-- ol
　　　|　　　　　　　　　|-- li
　　　|　　　　　　　　　　　　★
　　　|-- div　　.section
　　　　　　|--ol
　　　　　　　　|-- ol
　　　　　　　　　　　|-- li
　　　　　　　　　　　　　　☆

になります。開発者向けツール( https://addons.mozilla.jp/firefox/extensions/dev … )の豊富なfirefoxを使ってらっしゃると思いますが、ツールのDOMインスペクターやfirebugを使えば、簡単に分かります。

　これに対して
*{color:red;} だと全称セレクタですべての要素に、colorは継承される。
body{color:black;}だと、タイプセレクタで詳細度1にて
body div{color:green;}
body div.header{}
body div.header div.nav ol li{}
div.header div.nav ol li{}
とかセレクタで指定していく。

☆まず、最低限
HTML 4.01仕様書( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )
Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification (ja)( http://momdo.s35.xrea.com/web-html-test/spec/CSS … )
　だけは一通り目を通しましょう。
　絶対にそのほうが早道です。

　

- 0
- 件

通報する

この回答へのお礼

有難うございます

通報する

お礼日時：2014/01/04 16:33

No.3

回答者： self--
回答日時：2014/01/04 15:56

私も混乱した覚えがあります。

ご存じだとは思いますがDivは汎用的なブロック要素です。
<Div>は何をするものか？
</Div>で何を閉じるのかはっきりすると視界が開けると思います。

alignなどレイアウトに関わるものが多いと思います。
center left right等

<li>や<ul>はタグ属性です。
<Div>が無くても使えます。