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 |
Tags
- wp-900
- 휘닉스파크
- 제주도눈
- 덕소골프샵
- 서원힐스
- 개복숭아
- 야생개복숭아 판매
- 괌자유여행
- 포천투어
- 잠실수영장
- 제주도눈썰매
- 한라산
- LGG6
- 제주도설경
- 파주골프장
- 경기북부골프장
- 조경철천문대
- 돌복숭아
- 자연산개복숭아
- 개복숭아판매
- 제주도
- 태안수영장펜션
- 포천수영장
- 야생개복숭아
- 포천가볼만한곳
- 충주골프장
- 괌
- 자연산 개복숭아
- 포천온천
- 개복숭아 판매
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