SlideShare a Scribd company logo
1 of 7
<ul>,<ol>,<li>,<dt>,<dd>
<ul>
 순서가 중요하지 않은 비순서형 목록을 마
 크업 할 때 사용
 ul 속성
 compact 기본구문
 <ul compact="compact"></ul>
 dir 기본구문
 <ul dir="ltr | rtl"></ul>
 type 기본구문
 <ul type="circle | disc | square"></ul>
 순서형 목록을 마크업 할 때 사용
 주의사항
 중첩 형식의 하위 목록을 마크업할 때는 ul요소나 ol 요소의 자식 요소
 로는 li 요소만 올 수 있고, 직접적으로 ul,ol이 올 수 없다. 또 li 요소의
 자식 요소는 다른 블록 요소를 포함 시킬 수 있다.
<li>태그는 리스트를 나타내기 위해서 사용
<li>태그는 <ol>,<ul>태그와 함께 사용할 수
 있다. <ol>은 목록에 번호를 출력하고, <ul>
 은 번호를 출력하지 않는다.(기본값)
Type, value(ol에서만 적용), id, class를 사
 용할 수 있다.
 용어 정의 리스트를 생성할 때 사용
 dl의 경우 단순히 정의형 목록(용어 제목, 용
 어 설명 등)만이 아니라 주종 관계가 성립되는
 콘텐츠에 광범위하게 사용 할 수 있음
<dt>:목록에서 항목을 정의
<dd>: 목록에서 항목을 설명. <dd> 태그 내부
 에 <br>,<img>,link,<dl>,<dt>등을 넣을 수
 있다
ppt

More Related Content

Featured

Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
Kurio // The Social Media Age(ncy)
 

Featured (20)

Skeleton Culture Code
Skeleton Culture CodeSkeleton Culture Code
Skeleton Culture Code
 
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
 
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
 
How to have difficult conversations
How to have difficult conversations How to have difficult conversations
How to have difficult conversations
 
Introduction to Data Science
Introduction to Data ScienceIntroduction to Data Science
Introduction to Data Science
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best Practices
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project management
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
 
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
 
12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work
 
ChatGPT webinar slides
ChatGPT webinar slidesChatGPT webinar slides
ChatGPT webinar slides
 
More than Just Lines on a Map: Best Practices for U.S Bike Routes
More than Just Lines on a Map: Best Practices for U.S Bike RoutesMore than Just Lines on a Map: Best Practices for U.S Bike Routes
More than Just Lines on a Map: Best Practices for U.S Bike Routes
 
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
 

ppt

  • 2. <ul>  순서가 중요하지 않은 비순서형 목록을 마 크업 할 때 사용  ul 속성
  • 3.  compact 기본구문 <ul compact="compact"></ul>  dir 기본구문 <ul dir="ltr | rtl"></ul>  type 기본구문 <ul type="circle | disc | square"></ul>
  • 4.  순서형 목록을 마크업 할 때 사용  주의사항 중첩 형식의 하위 목록을 마크업할 때는 ul요소나 ol 요소의 자식 요소 로는 li 요소만 올 수 있고, 직접적으로 ul,ol이 올 수 없다. 또 li 요소의 자식 요소는 다른 블록 요소를 포함 시킬 수 있다.
  • 5. <li>태그는 리스트를 나타내기 위해서 사용 <li>태그는 <ol>,<ul>태그와 함께 사용할 수 있다. <ol>은 목록에 번호를 출력하고, <ul> 은 번호를 출력하지 않는다.(기본값) Type, value(ol에서만 적용), id, class를 사 용할 수 있다.
  • 6.  용어 정의 리스트를 생성할 때 사용  dl의 경우 단순히 정의형 목록(용어 제목, 용 어 설명 등)만이 아니라 주종 관계가 성립되는 콘텐츠에 광범위하게 사용 할 수 있음 <dt>:목록에서 항목을 정의 <dd>: 목록에서 항목을 설명. <dd> 태그 내부 에 <br>,<img>,link,<dl>,<dt>등을 넣을 수 있다