ボックスの[内容]と、匿名ブロックボックス

[新着] Webテンプレートを仮オープンしました



0   名前: サスケ : 2007/02/26(月) 10:26  ID:WvponL0/ sub-v7
前回の質問で貴重な御意見を沢山頂きありがとうございました。

勉強をしていき、分からない言葉があるのです。下記の説明の中の”内容”が具体的に
どのようなものをさしているのかよく分かりません、


教本などの説明→[CSSでは構造上、ボックスは、内容かボックスのいずれか1方しか含めません。]

ボックスを含むというのはなんとなく分かるのですが、[内容]とは何をさすのでしょうか、、、、?
具体的に教えていただけますか。
また、”A”の記述で、”ここは匿名ブロックボックス。 "ここのの部分に関しては

教本などの説明→[この部分もブロックボックスと考えて、これを匿名ブロックボックスと呼びます]

とだけあり”匿名ボックス"という呼び方は分かりましたが、この”匿名ボックス"ができてしまう記述法
は正しい記述方法なのかどうかは説明されていませんが、正しい記述なのでしょうか。

”B”に一応この記述が正しいのかな、と思いながら書いてみましたが、、、、、、。
もし”匿名ブロック”が現れる記述が正しくない(あるいは好ましくない)のであれば
記述されている全てのセレクタにボーダーを記述した場合”匿名ボックス”がなく全てがボックス(あるいはボックスの入れ子など)で囲まれているというのが正しい記述なのでしょうか。

※色々な教本やインターネットで”参考になるCSSのHP”を参考にすればその量、
記述の違いに戸惑ってしまいます。まず基本的なところから理解していきたいのです。

なにとぞ宜しくお願いいたします。







<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01//EN'
'http://www.w3.org/TR/html4/strict.dtd'>
<HTML lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<TITLE></TITLE>
<meta http-equiv="content-script-type" content="text/javascript">

<STYLE TYPE="text/css">
<!--

body {
background: #37393B;;
color: #ffffff;
line-height:12px;
font-size: 11px;
margin-top:18px;
margin-left:20px;
}


div {
width: 300px;
margin : 30px;
padding : 10px;
border: solid 1px #FF0018;
}

p {
width: 280px;
padding : 10px;
border: solid 1px #2103FA;
}
-->
</style>
</head>
<body>


<!--Aの記述 -->
<div >
ここは匿名ブロックボックス。
<p>通常のボックス</p>
</div>

</body>
</html>


<!--Bの記述 -->
<div >
<p>このような記述が正しいのでしょうか?</p>
<p>通常のボックス</p>
</div>

</body>
</html>




1   名前: 匿名 : 2007/02/26(月) 10:26  ID:9jO6XtAy sub-kJ
えーと、教本にグロッサリ(用語解説)かインデクス(用語索引)はついてない?用語の使い方が、仕様に沿ったものなのか、それとも解説のために端折ったものなのか、こちらでは判断できない。用語の使い方については、前書きあたりに書いてあるものだけど。

> [内容]とは何をさすのでしょうか

分からない。少なくとも、CSS 規格上の特別な用語ではない。

だが、たぶんここで言いたいことは、
<p>坂道を<em>上れば</em>、海が見える。</p>

という構造が、CSS ボックス的には
<p><anonymous>坂道を</anonymous><em>上れば</em><anonymous>、海が見える。</anonymous></p>

と同等と見なされる、ということでしょ。そうなるとボックス内部には、1 個のテキスト内容か、1 個以上のボックス内容か、そのどちらかしか存在しない。

> "匿名ボックス"ができてしまう記述法は正しい記述方法なのか

HTML が混合内容(A の記述のように、同一階層での要素とテキストの混在)を許す仕様なんだから「正しい」んじゃない? と言うか、上記の例の場合に、em 以外の場所を全部 span にするなんて、実用的とは思えない。

もっとも、div 要素内に関しては、万一タグをはぎ取っても妥当文書であるよう(B の記述のように)マークアップすべき、という意見には同意。また、CSS に限らず、DOM でも XPath でも、テキストノードの処理は結構面倒くさいので、場合によっては混合内容を避けた方が良いケースもある。


# と言うか、HTML の話と CSS の話がごっちゃになってる気がするよ。CSS 自体は HTML とは独立した規格。HTML としての「正しさ」と、CSS としての「正しさ」は、直接的には関係ない。質問者が聞いているのは、HTML としての「正しさ」の方だよね。

# また「正しさ」と言っても、規格に準じているという「正しさ」と、理念に沿っているという「正しさ」と、実用上こうすべきという「正しさ」は、別物だと思う。どのレベルでの「正しさ」を聞いているのかな。

2   名前: サスケ : 2007/02/26(月) 10:26  ID:Gl19gAX2 sub-v7
匿名さん、

御回答ありがとうございます。

まず私の言う”正しい”とは、いわゆる”文法的であったり規定されている決まりごと”などのことではなく(そのことが理解できていれば相談することもないと思うのですが)、

この掲示板で幾度か質問をさせていただいた折、何人の方からか(CSSに関してかなりの知識をお持ちの方だと私は思っています)適切なアドバイスを受けたことがあります。
まさにその方達に私は、その方の考え方として(というかCSSの理解の仕方として)”あなた達のお考えとしてはこれは正しいでしょうか”とお聞きしているのです。
幾冊もの教本を読んで自分なりに理解をしたつもりでもいまいち自信がもてないときなどにアドバイスをしていただけるとその課題の区切りとしてすごく安心すると言うか、、、。

”教本にグロッサリ〜”
インターネットで”div”検索でたまたま出会わしたページで気になった箇所を質問したのです。

http://www6.plala.or.jp/go_west/nextcss/ref/article/box_var.htm

御回答どうもありがとうございました。






3   名前: 枝葉阿太郎 : 2007/02/26(月) 10:26  ID:D13KwVcf sub-Ds
 疑問が晴れないようであれば、下手な「教本」を当たるより「仕様書」を読んだほうがいいと思います。

HTML4.01仕様書:
http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/cover.html
http://www.w3.org/TR/html401/

CSS Level2仕様書:
http://www.y-adagio.com/public/standards/tr_css2/toc.html
http://www.w3.org/TR/REC-CSS2/

 >>2の資料は書いている人の名前(ばあど氏)で過去ログなどを探せば、かなり信頼度が高いであろうことは窺い知れることでしょう。
#最近見かけないなぁ・・・

余談・XHTML、CSS を学ぶ時の 6つの間違い(特に6つ目に注目):
http://hyper-text.org/archives/2006/11/xhtml_css_master_mistakes.shtml

4   名前: カヅサツ ◆ThCi95HEzw : 2007/02/26(月) 10:26  [URL]  ID:O5hEMlpW sub-r2
あとは、http://members.jcom.home.ne.jp/pctips/www/ も参考になるかと思います。

5   名前: サスケ : 2007/02/26(月) 10:26  ID:3iGgfQlQ sub-v7
枝葉阿太郎さん。

アドバイスありがとうございます。
”下手な「教本」を当〜”最近あちこちの教本などの記述の違いなどをみるにつけ
信頼できる”仕様書」”の必要性を強く感じるようになってきました。

ありがとうございました。


6   名前: サスケ : 2007/02/26(月) 10:26  ID:3iGgfQlQ sub-v7
カヅサツ さん。

とても参考になる(まだ全部みていませんが)サイトをお教えいただき
ありがとうございます。

これからも宜しくお願いいたします。


7   名前: 匿名 : 2007/02/26(月) 10:26  ID:9jO6XtAy sub-kJ
余談。

>>2
少なくとも CSS2 仕様書では、"inline content"、"block content"、"document content" と、内容(content)を「テキスト内容」に限定した意味では使っていない。用語については、著者自身に聞いた方が良い(あちらに掲示板もあるし)。


> 私の言う”正しい”とは(後略)

把握しました。

例 1:
<p><span>あの坂を</span><em>登れば</em><span>、海が見える。</span></p>
まず >>1 でも述べたように、匿名ブロックが現れること自体は何ら問題ない。匿名ブロックを避けるために上のようなマークアップをしても、かえって変。

例 2:
<div class="prologue">
  少年は言った。
  <p>あの坂を登れば、海が見える。</p>
</div>
div 要素は、要素のグループ化を行う。だがこの場合、"prologue" というクラス名はあくまで制作者定義のものであって、世界中で共有されているわけではない。一般的なプログラムは "prologue" の意味を知る術がない。故に「少年は言った。」にも意味付けが必要。

例 3:
<ul>
  <li>menu1
    <ul>
      <li>menu1-1</li>
      <li>menu1-2</li>
    </ul>
  </li>
</ul>
上記のマークアップが文句を言われる筋合いは何もない。だが、重箱の隅あたりで微妙な問題が生じたりする。個人的には menu1 に何らかのマークアップを施したい所だが、そうなると今度はマークアップのシンプルさを損ねる。ケースバイケース。

いずれも、HTML の問題であって、CSS との直接的な関係はないが(最後のケースは微妙)。

8   名前: サスケ : 2007/02/26(月) 10:26  ID:xJa7ng36 sub-v7
匿名さん、

ふたたびのご返答ありがとうございます。

こう考えてくると、CSSは解釈の問題などが絡んでくると結構奥が深い(?)ものなのですね。

10年以上も書き続けてきた、HTMLの、テーブルレイアウトの複雑なまあゴチャゴチャしたソース
をみるにつけ、最近、一番意識していることはHTML部のソースをなるべくシンプルに、、、
ということです。

どうもありがとうございました。

一覧へ戻る