2013-04-02 2 views
0

[업데이트]]배경 스트레치

내가 div의와 테이블의 전체 창 및 내용을 커버하는 연신 된 배경 이미지를 배치 할.

이 코드는 잘 작동 :

<!doctype html> 
<html> 
<head> 
<title>Background to fit screen</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<meta http-equiv="Imagetoolbar" content="no"> 

<style type="text/css"> 
/* pushes the page to the full capacity of the viewing area */ 
html {height:100%;} 
body {height:100%; margin:0; padding:0;} 
/* prepares the background image to full capacity of the viewing area */ 
#bg {position:fixed; top:0; left:0; width:100%; height:100%;} 
/* places the content ontop of the background image */ 
#content {position:relative; z-index:1;} 
</style> 
</head> 

<body> 
<div id="bg"><img src="../images/background.jpg" width="100%" height="100%" alt=""></div> 
<div id="content"> 

<table> 
<tr> 
<td> 
<img src="images/1.jpg"> 
</td> 
<td> 
<img src="images/2.jpg"> 
</td> 
</tr> 
</table> 

</div> 
</body> 
</html> 

문제는 테이블의 셀에 이미지 사이의 간격입니다! 많은 이미지가 포함 된 매우 큰 테이블을 가지고 나면 꽤 나쁩니다.

도와주세요!

+0

IE6 도대체 무엇에 스타일을 부여? –

답변

2

테이블 div의 경우 재 작업하고 background-size : 100 % 100 %를 추가 할 수 있습니다.

<div id ="bg" style="background-image: url(../image/background.jpg); background-size: 100% 100%;"> 
    <table> 
    <!--table stuff--> 
    </table> 
</div> 

분명히 내 인라인 CSS를 CSS 파일로 가져오고 싶지만, 일반적인 생각을 제공합니다. IE3 버전에서는 CSS3를 지원하지 않기 때문에 대신 배경색을 사용하는 것이 좋습니다.

+0

안녕하세요. 문제는 배경 크기를 사용하여 이미지가 비례 적으로 늘어납니다. 이제 문제는 표의 이미지 사이의 간격입니다. – originalp

0

은 테이블 폭 100 %를주고 테이블

#content { background-image:url('image.jpg'); } 
관련 문제