カテゴリー別アーカイブ: リスト

[Dreamweaver]リストの入れ子

電車内でマスクをしていることをいいことに、口をあけて爆睡していたら、自分の「ふごっ」という声で目がさめたスタッフ「ほ」です。
もう、めちゃくちゃ恥ずかしかった・・・

さて、今回はドリームウィーバーネタです。

メニューやトピックの一覧などで活用する機会が多いリストですが、入れ子にして利用することができます。

たとえば、こんな場合です。

ブログのカテゴリ一覧リストなどで利用されることが多いです。
ちなみに、マークアップは以下のようになります。

慣れないと、ちょっとややこしい感じですね。

さて、Dreamweaverで、このリストの入れ子を作る方法をご紹介します。

まずは、全項目をすべて行を分けて書き、
書けたら、それらをすべてザザーッと選択します。

プロパティインスペクタにあるリストボタンをクリックしてリストにします。

この時点では、全項目で1つのリストになっています。

では入れ子を作ってみます。

「桃」~「ハンバーグ」までをドラッグで選択してください。

続いて、プロパティインスペクタから、「テキストインデント」をクリックします。

以上で、ドラッグ選択されていたエリアが入れ子のリストに変換されました。

もうちょっと簡単な方法として、入れ子にしたい部分をドラッグ選択してから、キーボードの「Tab」キーを押す、という方法もあります。

ちなみに入れ子を解除したい場合は、ドラッグ選択した後、「テキストインデント解除」ボタンをクリックするか、「Shift」+「Tab」キーで行えます。

覚えておくと、ちょっと複雑なメニューを作るときに、役立つと思います。

バンフートレーニングスクールは 最短2日間でアプリケーションを習得できる 講座をご用意しております。

  1. 無料体験
  2. 資料請求
  3. お問合せ