Dicas para realizar quebra automática de linha ao criar páginas CSS da web
Autor：Eve Cole
Data da Última Atualização：2009-06-12 17:54:54
Dicas para realizar o quebra automática de linha ao criar páginas CSS Sexta-feira, 6 de março de 2009 10:47 Todo mundo sabe que o inglês contínuo ou os números podem fazer o contêiner se expandir e não podem ser agrupados automaticamente de acordo com o tamanho do contêiner. usando o método CSS.
Para div 1. (navegador IE) white-space:normal; word-break:break-all aqui o primeiro segue o padrão. #wrap{espaço em branco:largura normal:200px;
ou
#wrap{word-break:break-all;width:200px;}ex.<div id="wrap">ddd111111111111111111111111111111</div>Efeito: a quebra de linha pode ser obtida 2. (navegador Firefox) white-space:normal; word -break:break-all;overflow:hidden; Da mesma forma, não existe um bom método de implementação no FF. Você só pode ocultar ou adicionar barras de rolagem. #wrap{espaço em branco:largura normal:200px;
ou
#wrap{word-break:break-all;width:200px; overflow:auto; }eg.<div id="wrap">ddd11111111111111111111111111111</div> Efeito: o contêiner está normal e o conteúdo está oculto para a tabela 1. (navegador IE) use o estilo table-layout:fixed;
por exemplo.<estilo>
.tb{layout da tabela: fixo}
</style><table class="tbl" width="80">
<tr>
<td>abcdefgigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table>Efeito: Pode quebrar linhas 2. (navegador IE) Use o estilo table-layout: fixo e nowrapeg.<style>
.tb {layout da tabela: fixo}
</style><table class="tb" width="80">
<tr>
<td nowrap>abcdefgigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table>Efeito: pode quebrar 3. (navegador IE) use o estilo table-layout:fixed e nowrap<style> ao usar porcentagem para corrigir o tamanho td http://www.knowsky.com/
.tb{layout da tabela: fixo}
</style><table class="tb" largura=80>
<tr>
<largura td=25% nowrap>abcdefgigklmnopqrstuvwxyz 1234567890
</td>
<td nowrap>abcdefgigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table> Efeito: Ambos os tds são agrupados normalmente 3. (navegador Firefox) Ao usar porcentagem para corrigir o tamanho do td, use os estilos table-layout: fixo e nowrap, e use diveg.<style>.
.tb {layout da tabela: fixo}
.td {estouro: oculto;}
</style><table class=tb largura=80>
<tr>
<td largura=25% classe=td agorarap>
<div>abcdefgigklmnopqrstuvwxyz 1234567890</div>
</td>
<td class=td agorarap>
<div>abcdefgigklmnopqrstuvwxyz 1234567890</div>
</td>
</tr>
</table> A largura da célula aqui deve ser definida em porcentagem. O efeito é: exibição normal, mas sem quebra de linha (Nota: não há uma boa maneira de quebrar o conteúdo do contêiner em FF. Você só pode usar overflow para ocultar o extra. conteúdo para evitar afetar o efeito geral)
