[css] 배경이미지 고정(body/table) - background-repeat: no-repeat;
페이지 정보
본문
BODY 혹은 TABLE에 배경을 고정시켜야만하는 경우가 생긴다.
그때 유용하게 사용될 소스다.
1. 배경이미지 고정 - CSS을 이용한 배경이미지 고정법
2. TD 배경고정 - CSS을 사용하지 않은 배경이미지 고정법
## background=position 의 값에 따라 배경이미지의 위치가 달라짐
[사용예] 0 0 => 왼쪽 상단 , bottom 0 => 하단 왼쪽, bottom right => 하단 오른쪽
그때 유용하게 사용될 소스다.
1. 배경이미지 고정 - CSS을 이용한 배경이미지 고정법
<style type="text/css">
BODY {
margin-left: 1em; /* 고정 이미지가 보이도록 열어 준 것임 */
background-image: url('배경이미지경로'); /* 배경이미지 경로 */
background-position: 260 left; /* 디폴트는 top left, 혹은 0 0 */
background-attachment: fixed;
background-repeat: no-repeat; /* 디폴트는 repeat */
}
</style>
<style type="text/css">
BODY {
margin-left: 1em; /* 고정 이미지가 보이도록 열어 준 것임 */
background-image: url('배경이미지경로'); /* 배경이미지 경로 */
background-position: 260 left; /* 디폴트는 top left, 혹은 0 0 */
background-attachment: fixed;
background-repeat: no-repeat; /* 디폴트는 repeat */
}
</style>
BODY {
margin-left: 1em; /* 고정 이미지가 보이도록 열어 준 것임 */
background-image: url('배경이미지경로'); /* 배경이미지 경로 */
background-position: 260 left; /* 디폴트는 top left, 혹은 0 0 */
background-attachment: fixed;
background-repeat: no-repeat; /* 디폴트는 repeat */
}
</style>
2. TD 배경고정 - CSS을 사용하지 않은 배경이미지 고정법
<TD style='background-image:url(배경이미지경로); background-repeat:no-repeat; background-position:bottom right; background-attachment:fixed;'>
</TD>
<TD
style='background-image:url(배경이미지경로); background-repeat:no-repeat;
background-position:bottom right; background-attachment:fixed;'>
</TD>
</TD>
## background=position 의 값에 따라 배경이미지의 위치가 달라짐
[사용예] 0 0 => 왼쪽 상단 , bottom 0 => 하단 왼쪽, bottom right => 하단 오른쪽
관련링크
-
http://gaerae.tistory.com/139
3564회 연결
댓글목록
pahs님의 댓글
pahs 작성일좋은자료 감사드립니다.
해맑은하늘님의 댓글
해맑은하늘 작성일찾던자료네요..감사합니다
