Notice
Recent Posts
Recent Comments
Link
이야기앱 세상
CSS 목록 스타일 이미지 처리 및 위치 이동하기 본문
목록 스타일 이미지 처리 및 위치 이동하기
ul 태그를 사용할 때 검정색 점 대신 이미지로 나열하고 싶은데 막상 나열하게 되면 이미지 사이즈를 잘 조정해서 글자와 맞추지 않으면 이미지와 글자의 차이로 어색해지는 경우가 있다. 이미지의 위치와 글자의 위치를 조정해서 자연스럽게 맞추려면 목록 스타일 유형을 안 보이게 처리하고 백그라운드 이미지를 사용해서 조정하는 방법이 유용하다.
li{
background: url(../images/bullet.gif) no-repeat 10px 5px;
list-style-type: none;
padding: 0px 0px 12px 24px;
}
반응형
'IT > CSS' 카테고리의 다른 글
CSS border-radius를 이용해서 사각형 형태의 사진을 원형 사진으로 만들기 (0) | 2018.12.17 |
---|---|
줄바꿈 처리 CSS 속성 word-wrap, word-break (0) | 2018.12.16 |
CSS table에서 첫번째 tr 고정 나머지 tr 스크롤 처리하기 (0) | 2018.12.16 |
CSS 글자색은 선명하고 배경색은 투명하게 처리하기 (0) | 2018.12.15 |
CSS div 태그에서 수직으로 정렬하기 (0) | 2018.12.15 |
Comments