Comentários da página da web geram transbordamento de texto no IE

Autor：Eve Cole Data da Última Atualização：2025-06-12 01:16:01

O código experimental é o seguinte:

<! Doctype html public -// w3c // dtd xhtml 1.0 transitório // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd> xmlns = http: //www.w3.org/1999/xhtml> <head> <meta http-equiv = content-type content = text/html; charset = gb2312/> <title> mais um porco </ititure> </ad Head> <body> <div estilo = width: 400px> <div style = float: esquerda> </div> <!--> <div estilo = float: direita; largura: 400px> acaça é o porco extra </div> <//body> </body> </body> </ht </ht: 400px> individ é o porquinho extra </div> </corpora> </body> </body> </ht </ht </ht: 400px> aque ISTO é o porco extra </div> </corpo>

Dica: você pode modificar algum código primeiro e depois executar 1. Teste no IE e FF, e apenas o excesso de texto ocorre no IE.

Nota: O transbordamento de texto causado por comentários é um bug do IE.

2. Remova o flutuador: esquerda; Em <div style = float: esquerda> </div>, e você descobrirá que a palavra extra "porco" está faltando e a página é exibida normalmente.

Dica: você pode modificar algum código primeiro e depois executar o mesmo flutuador: à direita; Em <div estilo = float: direita; largura: 400px>. A palavra de porco extra também desaparece e a página é exibida normalmente.

Dica: você pode modificar primeiro algum código e depois executar as instruções: o excesso de texto causado por comentários está relacionado ao bloqueio de flutuação.

3. Transfira os comentários para a frente de <div estilo = float: esquerda> </div>, o excesso de palavra porco desaparece e a página é exibida normalmente.

<! Doctype html public -// w3c // dtd xhtml 1.0 transitório // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd> xmlns = http: //www.w3.org/1999/xhtml> <head> <meta http-equiv = content-type content = text/html; charset = gb2312/> <title> Um porco </ititle> </ad Head> <body> <div estilo = largura: 400px> <!--> <div estilo = float: esquerda> </div> <divindade = float: direita; largura: 400px> ofic é o porco extra </div> </div> </body> </bodyl> </ht: 400px> aca

Dica: você pode modificar algum código primeiro e depois executar e transferir os comentários para <div estilo = float: direita; largura: 400px> ↓ Este é o porco extra </div>. A palavra de porco extra também desaparece e a página é exibida normalmente.

Dica: você pode modificar primeiro algum código e depois executar as instruções: o transbordamento de texto causado por comentários está relacionado ao seu local. (Pode ser entendido em conjunto com o ponto 2)

4. Remova a largura: 400px em <Div Style = Float: Direita; Largura: 400px>, o excesso da palavra porco desaparece e a página é exibida normalmente.

Dica: você pode modificar primeiro algum código e depois executar as instruções: o transbordamento de texto causado por comentários está relacionado à largura fixa do bloco de texto (seja um valor absoluto ou um valor relativo).

5. Aumente o número de comentários: Quando 1 comentário, 1 palavra aparecerá; Quando 2 comentários, 3 palavras aparecerão; Quando 3 comentários, 5 palavras aparecerão ...

Dica: você pode modificar algum código primeiro e depois executá -lo

<! Doctype html public -// w3c // dtd xhtml 1.0 transitório // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd> xmlns = http: //www.w3.org/1999/xhtml> <head> <meta http-equiv = content-type content = text/html; charset = gb2312/> <title> mais um porco </title> </ad Head> <body> <div estilo = width: 400px> <div style = float: esquerda> </div>  <style = float: direita; largura: 400px> × </hint <//pig <//pig <//cig <//cig <//> </cig </niv </cig </niv </niv </divy) </Div Style = Float: direita; largura: 400px> ×

Dica: você pode modificar algum código primeiro e depois executá -lo

Dica: você pode modificar algum código primeiro e depois executá -lo. Obteremos uma fórmula da regra acima: o número de palavras transbordando de texto = o número de comentários * 2-1. O número de palavras aqui é verdadeiro quando há números chineses ou em inglês.

Quando a contagem de palavras de texto transbordante for maior que a contagem de palavras de texto, o bloco de texto desaparecerá.

<! Doctype html public -// w3c // dtd xhtml 1.0 transitório // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd> xmlns = http: //www.w3.org/1999/xhtml> <head> <meta http-equiv = content-type content = text/html; charset = gb2312/> <title> mais um porco </title> </ad Head> <body> <div estilo = width: 400px> <div style = float: esquerda> </div>   <!->  <! é o porco extra </div> </div> </body> </html>

Dica: você pode modificar primeiro algum código e depois executar as instruções: o número de palavras transbordantes está relacionado ao número de comentários.

A partir dos testes de 1 e 2, não coloque comentários entre 2 blocos flutuantes.

Solução:

1. Nenhum comentário é colocado. A solução mais fácil e rápida, hehe ...

Dica: você pode modificar algum código primeiro e depois executar 2. Não coloque comentários entre 2 blocos flutuantes.

<! Doctype html public -// w3c // dtd xhtml 1.0 transitório // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd> xmlns = http: //www.w3.org/1999/xhtml> <head> <meta http-equiv = content-type content = text/html; charset = gb2312/> <title> Um porco </ititle> </ad Head> <body> <div estilo = largura: 400px> <!--> <div estilo = float: esquerda> </div> <divindade = float: direita; largura: 400px> ofic é o porco extra </div> </div> </body> </bodyl> </ht: 400px> aca

Dica: você pode modificar algum código primeiro e depois executar 3. Inclua o bloco de texto entre o novo <div> </div>, como: <div estilo = float: direita; largura: 400px> <div> vontade é o porco extra </div> </div>.

<! Doctype html public -// w3c // dtd xhtml 1.0 transitório // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd> xmlns = http: //www.w3.org/1999/xhtml> <head> <meta http-equiv = content-type content = text/html; charset = gb2312/> <title> mais um porco </ititle> </ad Head> <body> <div estilo = width: 400px> <div style = float: esquerda> </div> <!--> <div estilo = float: direita; largura: 400px> <div> osso é o extra, </div> </hiv:

Dica: você pode modificar primeiro algum código e depois executar 4. Remova a largura fixa do bloco de texto, que possui semelhanças com 3.

Dica: você pode modificar primeiro algum código e depois executar a análise e a solução acima que podem ser inadequadas ou imprecisas. Bem -vindo a discutir e me corrigir.