Whiteship's Note

Chapter 8. More Lists

View/HTML/CSS : 2008.03.23 15:20


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

<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에 각각 스타일을 적용할 수 있다.

'View > HTML/CSS' 카테고리의 다른 글

XPath Path Expression 문법  (0) 2009.05.15
Chapter 14. Image Replacement  (0) 2008.03.31
Chpater 13. Styling Text  (0) 2008.03.31
Chapter 10. Applying CSS  (0) 2008.03.26
Chapter 9. Minimizing Markup  (0) 2008.03.23
Chapter 8. More Lists  (0) 2008.03.23
Chapter 7. Anchors  (0) 2008.03.23
Chapter 6. Strong, EM and Other Phrase Elements  (0) 2008.03.23
Chapter 5. Forms  (0) 2008.03.23
Chapter 4. Quatations  (0) 2008.03.23
Chapter 4. Quatations  (0) 2008.03.20
top

TAG , , , ,



: 1 : ··· : 6 : 7 : 8 : 9 : 10 : 11 : 12 : 13 : 14 : ··· : 18 :