• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:ul li を使ったリストを作りたいんですけど。。。)

ul liを使ったリストを作成する際の問題と解決方法

このQ&Aのポイント
  • CSS初心者のため、ul liを使ったリストを作成する際に問題が発生しました。
  • 特にOpera9での表示において、意図しない改行や文字の配置のズレが発生しました。
  • 解決策をご存知の方は、教えていただけると助かります。

質問者が選んだベストアンサー

  • ベストアンサー
  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.1

CSSより前に、この文書はどのタイプのリストでしょうか? HTMLでは次のリストが用意されています。 ・順不同リスト (UL) ・序列リスト (OL)    リスト項目(LI) ・定義リスト(DL)、DT、    内容 DD要素 リストはその意味からこの3つに必ず分類します。 たとえば ・工具   ・作業工具   ・電動工具   ・荷役 ・金物   ・建築金物   ・厨房用品 これは、通常の箇条書き[順不同リスト (UL)]ですから <ul>   <li>工具     <ul>       <li>作業工具</li>       <li>電動工具</li>       <li>荷役</li>     </ul>   </li>   <li>金物     <ul>       <li>建築金物</li>       <li>厨房用品</li>     </ul>   </li> </ul> ※必ずタブなどで、インデントをつけて見やすくしましょう。  例では、全角スペースを使ってますから、タブなど(空白文字)に変換すること。  ★HTMLでは</li>は省略できますが、将来のXHTMLを考慮して、必ず書くようにしましょう。</閉じタグ>が現れれば、インデント解除すればソースが分かりやすくなります。  ★XHTMLへの発展を考えて、要素名や属性は小文字で書く癖をつけましょう。  ここまでできたら、CSSでデザインしましょう。ボタンにするなり、 【資料】 Lists in HTML documents (ja) http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/lists.html   

marondai
質問者

お礼

勉強になりました。丁寧に教えて頂きありがとうございました。

その他の回答 (2)

  • pick52
  • ベストアンサー率35% (166/466)
回答No.3

こういうリストなら定義リストを使った方がいいと思います。 http://www.tohoho-web.com/html/dl.htm http://www.htmq.com/html/dd.shtml なんか、少々位置がおかしいですけどこんな感じで。 <dl> <dt>ああああ</dt> <dd style="float: left;">いいいい</dd> <dd style="float: left;">うううう</dd> <dd>ええええ</dd> <dd style="float: left;">おおおお</dd> <dd style="float: left;">かかかか</dd> <dd>きききき</dd> <dt>くくくく</dt> <dd style="float: left;">けけけけ</dd> <dd style="float: left;">ここここ</dd> <dd>ささささ</dd> <dd>しししし</dd> <dt>すすすす</dt> <dd style="float: left;">せせせせ</dd> <dd>そそそそ</dd> </dl>

marondai
質問者

お礼

ありがとうございます。このやり方も試してみます。助かります。

  • SAYKA
  • ベストアンサー率34% (944/2776)
回答No.2

ああああ、くくくく、すすすす は通常通り。 他はその下階層の1つのli内に別のlist(ulとか)として記述 第一段階としては通常通り ああああ   いいいい   うううう   ええええ  ・・・ の形にしよう。 下階層のul(「いいいい」とかね)のliをcssで横並びになるように指定すれば完成 え?具体的なソース?この質問の仕方じゃ答えてあげると違反なのでこれが限界。 後は自分で調べようね。 または「この記述でできる筈なのに」とソースを出そうね。

marondai
質問者

お礼

ありがとうございました。ちょっと色々調べてみます。