メインの段組でのリスト

メインで段組を作成したときのリストです。

  • リスト1
  • リスト2
  • リスト3
  • リスト1
  • リスト2
  • リスト3
  • リスト1
  • リスト2
  • リスト3
  1. リスト1
  2. リスト2
  3. リスト3

段組の中で書くというだけで記述自体は簡単です。以下がHTMLです。

<div class="clearfix">
<div class="main_left_box1">
<ul>
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
</ul>
</div>
<div class="main_right_box2">
<ul class="list1">
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
</ul>
</div>
</div>
<div class="clearfix">
<div class="main_left_box2">
<ul class="list2">
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
</ul>
</div>
<div class="main_right_box1">
<ol>
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
</ol>
</div>
</div>

定義型リスト

定義１
ここに定義１の内容を書きます。
定義２
ここに定義２の内容を書きます。
定義１
ここに定義１の内容を書きます。
定義２
ここに定義２の内容を書きます。

このHTMLもそのまま段組の中に書けばよいだけです。

<div class="clearfix">
<div class="main_left_box1">
<dl>
<dt>定義１</dt>
<dd>ここに定義１の内容を書きます。</dd>
<dt>定義２</dt>
<dd>ここに定義２の内容を書きます。</dd>
</dl>
</div>
<div class="main_right_box2">
<dl>
<dt>定義１</dt>
<dd>ここに定義１の内容を書きます。</dd>
<dt>定義２</dt>
<dd>ここに定義２の内容を書きます。</dd>
</dl>
</div>
</div>