Chapter 8. More Lists

순서가 있는 목록을 표현하는 방법

<ul> 사용하기

<ul>

<li>1. Chop the onions.</li>

<li>2. Saute the onions for 3 minutes.</li>

<li>3. Add 3 cloves of garlic.</li>

<li>4. Cook for another 3 minutes.</li>

<li>5. Eat.</li>

</ul>
  • 중간에 새로운 요소를 추가하면 번호를 전부 수정해야 한다.
  • 숫자들 앞에 bullet이 붙는다. 이건 CSS로 띄어낼 수도 있지만, CSS를 모르는 옛날 브라우저들은 어떻게 하나..

<ol> 사용하기

<ol>

<li>Chop the onions.</li>

<li>Saute the onions for 3 minutes.</li>

<li>Add 3 cloves of garlic.</li>

<li>Cook for another 3 minutes.</li>

<li>Eat.</li>

</ol>
  • 자동으로 넘버링 해준다.
  • type 속성으로 여러가지 타입의 넘버링을 할 수 있지만, CSS 설정하는 것이 좋다. HTML 4.01에서 deprecated 됐다.

용어와 설명을 표현하는 방법은?

<ul> 사용하기

  • 용어에만 따로 스타일을 적용해야 한다면?

<dl>, <dt>, <dd> 사용하기

<dl>

<dt>CSS</dt>

<dd>A simple mechanism for adding style (e.g. fonts, colors, spacing)

to Web documents.</dd>

<dt>XHTML</dt>

<dd>A family of current and future document types and modules that

reproduce, subset, and extend HTML, reformulated in XML.</dd>

<dt>XML</dt>

<dd>A simple, very flexible text format derived from SGML.</dd>

</dl>
  • term과 description에 각각 스타일을 적용할 수 있다.