掲示板/総合質問板/過去ログ/一覧/ <dl>か<table>を使うか？

0 名前：イサ： 2006/03/31 06:50: 現在作成中のＨＰにＱ＆Ａ集を作りたいのです。

Ｑ，しつもんします。
Ａ，おこたえします。・・・・こんな感じにしたいのです。

<P>タグで作ると折り返した文書の出だしがそろいません。

Ｑ，しつもん
します。
Ａ，おこたえ
します。・・・・・・こうなってしまいます。

<dlcompact>だとうまくいきますが、Ｑ＆Ａが増えればリンクを使用
したいと思いやってみると「しつもんします。」の部分がずれてしま
います。<table>タグなら出来るとは思います。
ＨＴＭＬの本等で調べると、結局<dlcompact>も<table>（表以外の使用）
も推奨されないタグだそうで、他のＨＰのＱ＆Ａ集は、<table>タグで作成
しているようなのですが、できれば推奨されないタグを使用したくないので、
他の方法があればと思い質問しました。

よろしくおながいします。

1 名前： Pid ： 2006/03/31 06:50: <dl>
<dt>Ｑ，しつもんします。</dt>
<dd>Ａ，おこたえします。</dd>
</dl>

dl, dt, dd { margin: 0; padding: 0; }

<p class="question">Ｑ，しつもんします。</p>
<p class="answer">Ａ，おこたえします。</p>

p { margin-left: 1em; text-indent: -2em; }

見た目は CSS でいくらでもどうこうできますので，重要なのはどちらのマークアップがより文書構造を反映しているかです（個人的には，Q&A という文書形式には dl が良いと思いますが，文脈によっては p でも良いかもしれないし，table だって良い場合もあります）。

2 名前：イサ： 2006/03/31 06:50: Pidさん　　ご返答ありがとうございます。
あらためて、自分の質問内容を見ると、説明不足でした。

文書が長くなると折り返され

Ｑ，しつもん
します。
Ａ，おこたえ
します。・・・・・こうなります。それを

Ｑ，しつもん
　　します。
Ａ，おこたえ
　　します。・・・・・というように２行目の先頭をそろえたいのです。

説明不足で、ほんとうに失礼な事をしました。
Pidさん！ごめんなさい。
上記を参考に<dl>タグとＣＳＳで、何とか位置調整の方法を勉強します。

3 名前： Pid ： 2006/03/31 06:50: そういうことでしたら CSS の text-indent を使えば良いかと。

もし Q と A が画像なら，list-style-image でリストマーカにすると良いと思います。

4 名前：イサ： 2006/03/31 06:50: ご返答何度もすいません。

ご指摘のとおりtext-indentで何とかなりそうです。
ありがとうございました。

将来的には、ＱＡの画像を入手し、list-styleにしたいと思います。

5 名前： S ： 2006/03/31 06:50: 　どなたも突っ込まないので。
　HTML4.01仕様書(日本語版)をあたったのだけれど、>>0で掲げられている”dlcompact要素”ってのが見つからなかった。

http://www.asahi-net.or.jp/~SD5A-UCD/rec-html401j/index/elements.html

　何か独自規格で定義されている要素？

6 名前： Newのり太 ： 2006/03/31 06:50: > >>0で掲げられている”dlcompact要素”ってのが見つからなかった。

スレ主さん、つなげちゃってますが、dl要素のcompact属性のことでしょうね。
http://www.tagindex.com/html_tag/list/dl_compact.html

7 名前： S ： 2006/03/31 06:50: 　仕様書を確認したけれど、dl要素にはcompact属性は定義されてないみたい。

http://www.asahi-net.or.jp/~SD5A-UCD/rec-html401j/struct/lists.html#h-10.3

（以下は引用）
>>開始タグ: 必須、終了タグ: 省略可能
>>
>>別途定義がある属性
>>
>>id、class (文書内識別子)
>>lang (言語情報)、dir (テキスト方向)
>>title (要素情報)
>>style (行内スタイル情報)
>>onclick、ondblclick、 onmousedown、onmouseup、 onmouseover、onmousemove、 onmouseout、onkeypress、 onkeydown、onkeyup (組込みイベント)
>>定義リストは他の形式のリストとは少しだけ異なり、リスト項目が、用語と記述という2つの部分から構成される。用語はDT要素で示され、行内内容に制限される。記述は、ブロックレベル内容を取るDD要素で示される。

　念のためにW3Cのほうも探してみた。

http://www.w3.org/TR/html4/struct/lists.html#h-10.3

（以下は引用）
>>Start tag: required, End tag: optional
>>
>>Attributes defined elsewhere
>>
>>id, class (document-wide identifiers)
>>lang (language information), dir (text direction)
>>title (element title)
>>style (inline style information)
>>onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup (intrinsic events)
>>Definition lists vary only slightly from other types of lists in that list items consist of two parts: a term and a description. The term is given by the DT element and is restricted to inline content. The description is given with a DD element that contains block-level content.

　ul、ol、liの各要素にはtype、start、value、compactの各属性が登場するけれど、dl、dt、ddの各要素にはそれらの属性が定義されていないように思えるが、私の仕様書の読み方が誤っているのだろうか。
　まあ、どちらにしろtype、start、value、compactの各属性は「非推奨」だから無視してもよいのだけど。

8 名前： Pid ： 2006/03/31 06:50: 仕様の本文内では，deprecated[*] な属性については，あまりきちんと書かれていません。そこで，属性索引を見てみます。
http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/index/attributes.html

すると，compact 属性は Transitional DTD で定義され，dl 要素にも存在することが分かります。DTD を確認してみて下さい。
http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/sgml/loosedtd.html

----------
[*]「非推奨」と訳されますが，本来は「使用に反対」の意味ですから，積極的に「廃止予定」でも良いと思います（実際に廃止されたら obsolete「時代遅れ」）。
http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/conform.html#deprecated

9 名前： S ： 2006/03/31 06:50: >>
>>
>><!ELEMENT DL - - (DT|DD)+ -- definition list -->
>><!ATTLIST DL
>> %attrs; -- %coreattrs, %i18n, %events --
>> compact (compact) #IMPLIED -- reduced interitem spacing --
>> >
>>
>><!ELEMENT DT - O (%inline;)* -- definition term -->
>><!ELEMENT DD - O (%flow;)* -- definition description -->
>><!ATTLIST (DT|DD)
>> %attrs; -- %coreattrs, %i18n, %events --
>> >
　お、本当だ。compact属性があるね。ご指摘ありがとう。

>>本来は「使用に反対」の意味ですから，積極的に「廃止予定」でも良いと思います。
　廃止予定という言い方が確かにいいかも。これからはその表現を使わせてもらいます。