F11
이미지를 클릭
오른쪽마우스
Properties
Allow smoothing 체크
Compression 이미지 확장자 photo (jpeg), Lossless (png/gif)
F11
이미지를 클릭
오른쪽마우스
Properties
Allow smoothing 체크
Compression 이미지 확장자 photo (jpeg), Lossless (png/gif)
배경이미지를 고정시켜 항상 제자리에 놔두기
배경이미지 고정 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>
## background=position 의 값을 어떻게 주느냐에 따라 배경이미지의 위치가 달라진다.
## 0 0 => 왼쪽 상단 , bottom 0 => 하단 왼쪽, bottom right => 하단 오른쪽....등으로 표현할수있다.
[예제응용]
스타일시트를 사용하지 않고 바로 해당 테이블이나 <TD>에 적용할 경우는 아래와 같다.
<TD style='background-image:url(이미지경로/이미지.gif); background-repeat:no-repeat; background-position:bottom right; background-attachment:fixed;'></TD>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MONONEMO</title>
</head>
<frameset rows="0,*" frameborder="no" border="0" framespacing="0">
<frame src="no.html" name="topFrame" scrolling="No" noresize="noresize" id="topFrame" />
<frame src="intro.html" name="mainFrame" id="mainFrame" />
</frameset>
<noframes>
<body>
</body>
</noframes></html>
rows = "0,*"은 프레임을 상하고 나누는 것으로 보이지 않는 0 픽셀의 상단 프레임을 제외한 나머지 픽셀(*)로 보여진다.
사이트 주소창이 지저분해지는 것을 못마땅하게 생각하시는 분들은 사용하시길 추천합니다.