12.웹프로그래밍, CSS, 리스트(list) 스타일을 꾸며보는 방법에 대해서 알아볼께요 ^^

블로그목적

CSS관련 리스트에 대해서 공부및 정리 후 공유한다.

리스트 스타일을 한번 꾸며 보아요.

리스트 스타일도 CSS로 지정이 가능함.

속성

속성	설명	비고
list-style	리스트에 대한 속성을 한줄로 설정함.
리스트 항목 마커를 이미지로 지정함.
list-style-position	리스트 마커의 위치를 안쪽 or 바깥쪽으로 지정함.
list-style-type	리스트 마커의 타입을 지정함

예시

list-style-type

<ul> : disc, circle, square

<ol> : decimal, decimal-leading-zero, lower-roman, upper-roman, lower-greek, lower-latin, upper-latin, armenian, georgian, lower-alpha, upper-alpha

공통 : none

의미상으로는 <ul>과 <ol>에 사용하는 속성값을 구분하는게 맞지만, <ul>에 decimal을 사용하거나 <ol>에 disc를 사용하는 등 바꾸어 사용해도 됨.

list-style-position

inside : 문단 안쪽에 놓음

outside : 문단 바깥쪽에 놓음.

initial : 기본값으로 설정

inherit : 부모 요소의 속성값을 상속받음.

none : 이미지가 없음

url : 사용할 이미지의 URL을 입력함.

initial : 기본값으로 설정함.

inherit : 부모 요소의 속성값을 상속받음.

list-style

설명

위와 같이 모든 속성을 한줄에 사용할 수 있음.

square

list-style-type

url('thub_log.jpg')

inside

list-style-position

전체소스

웹브라우저 실행화면

설명

CSS를 리스트로 사용하면 리스트 항목 마커를 변경할 수 있으며 아래 속성을 사용하면됨.

list-style-type

리스트 항목마커의 위치를 안쪽 or 바깥쪽으로 지정하려면 아래 속성을 사용하면됨.

list-style-position

inside

안쪽으로 지정

outside

바깥쪽으로 지정

리스트 항목마커를 이미지로 변경하려면 아래 속성을 사용하면됨

​

결론

리스트 스타일도 CSS로 지정이 가능함.

리스트 스타일의 주요 속성은 아래와 같음.

list-style-position

list-style-type

리스트 스타일은 한줄로 속성을 지정할 수 있음.

list-style

오늘도 CSS를 이용한 리스트 스타일의 변경관련 마술(?) 한가지 획득완료. 감사합니다. ^^

---

오늘의 한마디 명언

우리는 건강의 "정답"을 찾기위해 한 전문가에서 다른 전문가로, 한 개념에서 다른 개념으로 수없이 넘나들고, 각 전문가의 의견에 살짝 발을 담갔다가 2주내에 상태가 좋아지지 않으면 바로 발을 뺀다.

하지만 내가 당신에게 알려주려 하는 "건강과활력, 나아가 뇌기능 개선"을 위한 여정은 조금도 어렵지 않다.

혼란스러울 일도 없다. 당신은 이 책을 통해 얻은 정보를 일상생활에 적용하고 그 결과를 주변 사람들과 나누면 된다.

이 여정의 핵심은 바로 "꾸준함" 에 있다.

나는 늘 환자들에게 "꾸준히 안타만 처도 야구 경기에서 이긴다"고 말한다.

이번 주에는 한가지만 배우겠다는 목표를 세우고, 실천에 옮겨보자.

항상 한 단계씩, 한번에 안타 한 개씩만 치면된다. 그러다 보면 당신이 깨닫기도 전에 건강한 삶이라는 야구 경기에서 이길 수 있는 지속적이고 영구적인 변화를 만들어내게 될 것이다.

톰 오브라이언 지음, "당신은 뇌를 고칠 수 있다." 중에서..

---

오늘의 영어 한마디

Sam is far from being smart.

same은 매우 멀다. / 영리한 상태로부터(결코 영리하지 않다.)

해설

"Sam" 은 영리한 상태와 분리되어 있음.

즉, Sam 은 영리하지 않다라는 의미임.

---

오늘의 민법 한마디(for real estate)

제1편 총칙 / 제2장 인

제14조의 2(특정후견의 심판)

1. 가정법원은 질병, 장애, 노령, 그 밖의 사유로 인한 정신적 제약으로 일시적 후원 또는 특정한 사무에 관한 후원이 필요한 사람에 대하여 본인, 배우자, 4촌 이내의 친족, 미성년 후견인, 미성년후견감독인, 검사 또는 지방자치단체의 장의 청구에 의하여 특정후견의 심판을 한다.

2 특정후견은 본인의 의사에 반하여 할 수 없다.

3. 특정후견의 심판을 하는 경우에는 특정후견의 기간 또는 사무의 범위를 정하여야 한다.