CSS 사용법
CSS 문법
클래스와 아이디
주석
텍스트
color
direction
backgroud-color
line-height
letter-spacing
text-align
text-decoration
text-indent
word-spacing
배경
background-color
background-image
background-repeat
background-position
background-attachment
Font
크기 단위
Box Model
경계선(border)
리스트(list)
CSS 배경이미지의 위치(background-position)

background-repeat 속성값으로 no-repeat을 지정하면 배경이미지가 반복되지 않고, 문서의 왼쪽 상단에 위치합니다.

<div style="width:250; height:250; background-image: url(bg.gif) ; background-repeat:no-repeat"></div>

이 위치를 바꿀때 사용하는 속성이 background-position 입니다.

<table width="90%" cellpadding="0" cellspacing="0" border="1" align="center" style="background-image: url(bg.gif) ; background-repeat:no-repeat; background-position:center right">
<tr height="100">
 <td width="30%">top left</td>
 <td width="30%">top center</td>
 <td width="30%">top right</td>
</tr>
<tr height="100">
 <td>center left</td>
 <td>center center</td>
 <td>center right</td>
</tr>
<tr height="100">
 <td>bottom left</td>
 <td>bottom center</td>
 <td>bottom right</td>
</tr>
</table>

예제에서는 center right 값으로 지정하였습니다.

top left top center top right
center left center center center right
bottom left bottom center bottom right

Copyright © Homejjang.com All rights reserved.