댓글 : 테이블의 배경 이미지는 100%를 표시 할 수 없습니다. 다행히 온라인에서 솔루션을 찾았습니다. 도움이 필요한 친구들이 그것을 언급 할 수 있습니다.
개발 중에 다음과 같은 상황이 발견되었습니다.
(1) 파일이 .jsp 파일 접미사 형식으로 저장되면 코드는 다음과 같습니다 (index.jsp).
코드는 다음과 같습니다.
<%@page contenttype = text/html; charset = utf-8 pageencoding = utf-8 언어 = java %>
<! doctype html public- // w3c // dtd xhtml 1.0 transitional // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd>
<html xmlns = http : //www.w3.org/1999/xhtml>
<헤드>
<meta http-equiv = content-type content = text/html; charset = utf-8 />
<title> 테이블에 100%</title>을 표시하십시오
</head> </p> <p> <바디 스타일 = 배경 :#9c9;>
<TABLE CellPading = 0 CellPacing = 0 Style = 너비 : 100%; >
<tr>
<td 높이 = 8 너비 = 17px; > <img src = img/bg-header_l.gif 너비 = 17 높이 = 8/> </td>
<td style = 배경 : URL (img/bg-header_c.gif) 반복 X;> </td>
<td 높이 = 8 너비 = 17px; > <img src = img/bg-header_r.gif 너비 = 17 높이 = 8/> </td>
</tr>
</테이블>
</body>
</html>
프로그램이 실행 된 후 페이지에 표시된 효과는 아래 그림에 나와 있습니다.
이 효과에는 두 개의 잘못된 장소가 있습니다.
(1) 중간에있는 TD의 배경은 전체 TD를 다루지 않습니다.
(2) 전체 테이블 너비가 전체 화면을 채우지 않습니다.
나는 당황하고 매우 우울했다! ! 백그라운드에서 테이블에 테두리 = 0을 추가하십시오. 그 효과는 위의 그림과 같이 여전히 나타납니다. 0에서 1까지 변경하고 테이블이 전체 화면을 채우고 TD가 아래 그림과 같이 배경으로 덮여 있지만 테이블의 경계는 내가 원하는 것이 아닙니다.
위의 방법은 문제를 근본적으로 해결할 수 없다는 것이 밝혀졌습니다.
그런 다음 테이블의 3 개의 TD를 비교 한 후 두 번째 TD에는 내용이 없다는 것을 알았으므로 두 번째 TD의 내용을 작성하려고했으며 코드는 다음과 같습니다.
<TABLE CellPading = 0 CellPacing = 0 Style = 너비 : 100%; >
<tr>
<td 높이 = 8 너비 = 17px; > <img src = img/bg-header_l.gif 너비 = 17 높이 = 8/> </td>
<td style = 배경 : URL (img/bg-header_c.gif) 반복 -x;> 두 번째 td는 컨텐츠를 추가합니다 </td>
<td 높이 = 8 너비 = 17px; > <img src = img/bg-header_r.gif 너비 = 17 높이 = 8/> </td>
</tr>
</테이블>
코드를 실행 한 후 효과는 기본적으로 최종 결과와 일치하며 작동 효과는 다음과 같습니다.
다음은 코드를 약간 조정하는 것입니다. 전체 코드는 다음과 같습니다.
코드는 다음과 같습니다.
<%@page contenttype = text/html; charset = utf-8 pageencoding = utf-8 언어 = java %>
<! doctype html public- // w3c // dtd xhtml 1.0 transitional // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd>
<html xmlns = http : //www.w3.org/1999/xhtml>
<헤드>
<meta http-equiv = content-type content = text/html; charset = utf-8 />
<title> 테이블에 100%</title>을 표시하십시오
</head>
<바디 스타일 = 배경 :#9C9;>
<TABLE CellPading = 0 CellPacing = 0 Style = 너비 : 100%; >
<tr>
<td 높이 = 8 너비 = 17px; > <img src = img/bg-header_l.gif 너비 = 17 높이 = 8/> </td>
<td style = 배경 : URL (img/bg-header_c.gif) 반복 -x; 글꼴 크기 : 0px;> & nbsp; </td>
<td 높이 = 8 너비 = 17px; > <img src = img/bg-header_r.gif 너비 = 17 높이 = 8/> </td>
</tr>
</테이블>
</body>
</html>
최종 효과는 아래 그림에 나와 있습니다.