Comentário: A imagem em segundo plano da tabela não pode ser exibida 100% é uma dor de cabeça. Felizmente, encontrei uma solução online. Amigos necessitados podem se referir a ele.
A seguinte situação foi encontrada durante o desenvolvimento:
(1) Se o arquivo for armazenado na forma de um sufixo de arquivo .jsp, o código será o seguinte (index.jsp):
O código é o seguinte:
<%@página contentType = text/html; charset = utf-8 pageEncoding = utf-8 idioma = java %>
<! Doctype html public -// w3c // dtd xhtml 1.0 transitório // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd>
<html xmlns = http: //www.w3.org/1999/xhtml>
<head>
<meta http-equiv = content-type content = text/html; charset = utf-8 />
<title> Deixe a tabela ser exibida 100%</title>
</head> </p> <p> <estilo de corpo = fundo:#9c9;>
<tabela CellPading = 0 CellPacing = 0 Style = Largura: 100%; >
<tr>
<altura td = 8 largura = 17px; > <img src = img/bg-heade_l.gif width = 17 altura = 8/> </td>
<TD Style = Background: URL (IMG/BG-CEADE_C.GIF) repetição-x;> </td>
<altura td = 8 largura = 17px; > <img src = img/bg-heate_r.gif width = 17 altura = 8/> </td>
</tr>
</tabela>
</body>
</html>
Após a execução do programa, o efeito exibido na página é mostrado na figura abaixo:
Existem dois lugares errados nesse efeito:
(1) o fundo do TD no meio não cobre todo o TD;
(2) A largura da tabela inteira não preenche toda a tela.
Eu estava intrigado e muito deprimido! ! No fundo, tente adicionar borda = 0 à tabela e o efeito ainda é como mostrado na figura acima. Altere 0 para 1 e encontre que a tabela preenche toda a tela, e o TD também é coberto com o plano de fundo, como mostrado na figura abaixo, mas a borda da tabela não é o que eu quero.
Verificou -se que o método acima não poderia resolver fundamentalmente o problema.
Então comparei os 3 TDs na tabela e descobri que não havia conteúdo no segundo TD, então tentei preencher o conteúdo no segundo TD, e o código era o seguinte:
<tabela CellPading = 0 CellPacing = 0 Style = Largura: 100%; >
<tr>
<altura td = 8 largura = 17px; > <img src = img/bg-heade_l.gif width = 17 altura = 8/> </td>
<TD Style = Background: URL (IMG/BG-CEADE_C.GIF) repetição-x;> O segundo TD adiciona conteúdo </td>
<altura td = 8 largura = 17px; > <img src = img/bg-heate_r.gif width = 17 altura = 8/> </td>
</tr>
</tabela>
O efeito após a execução do código está basicamente alinhado com o resultado final, e o efeito da operação é o seguinte:
A seguir, é apresentado um pequeno ajuste no código, o código completo é o seguinte:
O código é o seguinte:
<%@página contentType = text/html; charset = utf-8 pageEncoding = utf-8 idioma = java %>
<! Doctype html public -// w3c // dtd xhtml 1.0 transitório // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd>
<html xmlns = http: //www.w3.org/1999/xhtml>
<head>
<meta http-equiv = content-type content = text/html; charset = utf-8 />
<title> Deixe a tabela ser exibida 100%</title>
</head>
<estilo do corpo = fundo:#9C9;>
<tabela CellPading = 0 CellPacing = 0 Style = Largura: 100%; >
<tr>
<altura td = 8 largura = 17px; > <img src = img/bg-heade_l.gif width = 17 altura = 8/> </td>
<TD Style = Background: URL (img/bg-heate_c.gif) repetição-x; Size da fonte: 0px;> & nbsp; </td>
<altura td = 8 largura = 17px; > <img src = img/bg-heate_r.gif width = 17 altura = 8/> </td>
</tr>
</tabela>
</body>
</html>
O efeito final é mostrado na figura abaixo: