Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- 포천온천
- 제주도눈
- 괌
- 포천수영장
- 돌복숭아
- 잠실수영장
- 개복숭아판매
- 제주도
- 경기북부골프장
- 야생개복숭아 판매
- 조경철천문대
- 개복숭아 판매
- 괌자유여행
- 서원힐스
- 제주도설경
- 자연산 개복숭아
- 개복숭아
- 제주도눈썰매
- 한라산
- 포천가볼만한곳
- 충주골프장
- 포천투어
- 야생개복숭아
- LGG6
- 덕소골프샵
- 태안수영장펜션
- 휘닉스파크
- 파주골프장
- 자연산개복숭아
- wp-900
Archives
- Today
- Total
Live Brilliant
CSS 별표 평점표시 본문
*****test.html 소스보기*****
<link href="star.css" rel="stylesheet">
<div class="grade"> <span style="width:50%"></span> </div>
*****star.css소스보기*****
.grade {
MARGIN-TOP: 1px; DISPLAY: inline; BACKGROUND: url(bggray.gif) repeat-x; FLOAT: left; OVERFLOW: hidden; WIDTH: 65px; HEIGHT: 13px
}
.grade SPAN {
BACKGROUND: url(bgcolor.gif) repeat-x; FLOAT: left; HEIGHT: 13px
}
-------------------------------------------
우선은 평점주는 이미지는 스타일로 적용됩니다.
이미지는 회색의 백그라운드 이미지와 노란색칼라 이미지 2개가 필요하고요.
<div class="grade"> 이부분은 회색의 백그라운드 이미지가 들어가는 부분이고,
<span style="width:50%">이부분은 노란색칼라 이미지가 들어가는 부분입니다.
점수에 따라서 width를 조정하면 됩니다.
(예 : 평점 90점이면 <span style="width:90%">이 되겠지요.)
'개발은 핵찜이야 > HTML/CSS' 카테고리의 다른 글
같은 페이지 안에서 링크속성 다르게 적용 (0) | 2012.04.16 |
---|---|
웹페이지 프린트시 페이지 구분 (0) | 2012.04.16 |
레이어에 스크롤 생기게 (div) (0) | 2012.04.13 |
div 레이어 테이블 (0) | 2012.04.13 |
버튼 클릭시 이미지 팝업 호출 소스 (0) | 2012.04.13 |
Comments