Tagged

CSS

A collection of 18 posts

CSS

[CSS] 링크 적용 범위 넓히기, 롤오버 효과 주기

링크를 걸면 보통 텍스트 부위만 클릭할 수 있는데, 해당 블럭을 클릭할 수 있게 수정하면 좀 더 편리함. display:block; => a 엘리먼튼에 display:block을 적용함. 마우스를 올렸을 때 배경색이나 배경 이미지를 변경하여 현재 선택하려는 요소가 다른 것과 구분되게 함. a:hover { background-color: #94B8E9;} => hover 유사 클래스를 사용하여 간단하게 롤오버

CSS

[CSS]그라데이션 배경 사용하기

가로 폭 1px 짜리 그라데이션 이미지를 만들고, 가로로 쭉 반복 시켜줌. background: url(배경이미지) repeat-x; => 배경 이미지를 가로로 반복시킴. 세로로 반복하는 repeat-y도 있음. 배경이 커서 그라데이션 이미지로 커버가 안 될 때는 그라데이션이 끝나는 지점과 같은 색을 배경으로 깔아줌. background: 색상코드 url(images/new/level1_bg.png) repeat-x;