반응형
* 목록 표시 스타일 변경 3가지 속성
1. 목록 표시 변경 속성 : list-style-type 속성
list-style-type: none; /*square-사각,disc-검은원,circle-빈원,none-없음
2. 목록 표시를 이미지로 변경하는 속성 : list-style-image 속성
list-style-type: none; /*none, upper-alpha-대문자 알파벳,upper-alpha 대문자 로마자 등등.
3. 목록의 들여쓰기 변경 속성 : list-style-position 속성
- CSS 에서 이미지 가져오기 : url("경로") 함수사용
list-style-image: url("image2/dot.png");
- 목록 들여쓰기 속성 지정
list-style-position: inside; // 들여쓰기
* 목록 변경 속성값들을 한꺼번에 표시
- list-style: lower-alpha inside;
(==) 아래의 두개의 속성을 같이 쓴 것과 같다.
list-style-type: lower-alpha;
list-style-position: inside;
반응형
'자바스프링웹공부(2024) > HTML, CSS' 카테고리의 다른 글
2024.09.06.CSS - 박스모델 (0) | 2024.09.07 |
---|---|
2024.08.30.CSS - 박스모델(블럭요소,인라인요소,그림자효과) (0) | 2024.09.01 |
2024.08.23. CSS - 바깥쪽 여백(margin)과 안쪽(padding) 여백 (0) | 2024.08.25 |
2024.08.23. CSS - 텍스트 관련 스타일 (0) | 2024.08.25 |
2024.08.22. CSS(Cascading Style Sheet), 웹폰트와 아이콘폰트 (0) | 2024.08.22 |