집 > 기사 > 웹 프론트엔드 > CSS의 목록 스타일은 무엇입니까

CSS의 목록 스타일은 무엇입니까

coldplay.xixi원래의: 2021-03-21 17:56:253362검색

CSS의 목록 스타일은 다음과 같습니다: 1. CSS 정렬된 목록 [ol] 및 CSS 정렬되지 않은 목록 [ul] 2. CSS 목록 레이블 스타일 [list-style-type] 3. CSS 레이블 스타일 표시 방법 [list] -스타일 위치].

CSS의 목록 스타일은 무엇입니까

이 튜토리얼의 운영 환경: windows7 시스템, CSS3 버전, DELL G3 컴퓨터.

CSS의 목록 스타일은 다음과 같습니다.

1. CSS 정렬 목록(ol) 및 CSS 정렬되지 않은 목록(ul)

　　list.html
 
　　<!doctypehtml><html><head>
 
　　<metacharset="utf-8">
 
　　<title>列表样式</title>
 
　　<linkhref="box.css"type="text/css"rel="stylesheet"></head><body>
 
　　<p>
 
　　<ul>
 
　　<li>水果<ol>
 
　　<li>苹果</li>
 
　　<li>香蕉</li>
 
　　<li>梨子</li>
 
　　</ol>
 
　　</li>
 
　　</ul>
 
　　</p></body></html>

　속성 값:

　 원; 속이 빈 원
디스크; 단색 원
소수점; 숫자

　　list.css
 
　　ul>li{
 
　　list-style-type:circle;
 
　　}
 
　　ul>li>ol>li{
 
　　list-style-type:disc;
 
　　}

3. CSS 라벨 표시 방법 목록 style -style-position

속성 값: 외부(텍스트 외부, 기본값)

내부(텍스트 포함)

　　list.css
 
　　ul{
 
　　text-align:center;
 
　　list-style-position:outside;
 
　　}
 
　　ul>li{
 
　　list-style-type:circle;
 
　　}
 
　　ul>li>ol>li{
 
　　list-style-type:disc;
 
　　}

추천 관련 튜토리얼: CSS 비디오 튜토리얼

🎜

위 내용은 CSS의 목록 스타일은 무엇입니까의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

css css3 position ul

성명：

이전 기사：CSS에는 어떤 유형의 스타일이 있나요?다음 기사：CSS에는 어떤 유형의 스타일이 있나요?