리스트에 효과주기

Insert title here
  • Coffee
  • Tea
  • Cocoa
  1. 사과
  2. 바나나
  3. 포도
  4. 파인애플

 

예시

<head>
<meta charset="UTF-8">
<title>Insert title here</title>

<style type="text/css">
ul.ulist{
	list-style-image: url("https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbTZhZJ%2Fbtq6RMWWdrb%2FThqh4MzZVqAPV3TbyK4nSk%2Fimg.gif"); /* 이미지 넣기 */
}
.olist{

	list-style-type: lower-alpha;
}
</style>
</head>
<body>
<ul class="ulist">
	<li>Coffee</li>
	<li>Tea</li>
	<li>Cocoa</li>
</ul>
<ol class="olist">
	<li>사과</li>
	<li>배</li>
	<li>바나나</li>
	<li>포도</li>
	<li>파인애플</li>
</ol>
</body>

 

참고

list-style-image

이미지를 마커로 삽입할 수 있다.

list-style-type

마커를 변경해준다.

 

+ Recent posts