Todos nós sabemos que a tag <pre> pode definir texto pré-formatado, e uma aplicação comum é representar código-fonte de computador. O texto entre um pré-elemento geralmente retém espaços em branco e novas linhas, mas infelizmente quando você escreve código dentro de uma tag <pre>, se você não quebrar manualmente as novas linhas, ele também será preservado para você em vez da quebra de linha. Como não há muitos lugares onde o código-fonte é usado neste site, eu realmente não me importava com esse problema antes. Há pouco tempo, um internauta entusiasmado relatou esse problema no QQ, então, quando mudei o tema desta vez, olhei. para uma solução e compartilhou-a. Esta solução CSS pode fazer com que o texto da pré-tag seja automaticamente quebrado. Testei-a em todos os navegadores que possuo e todos suportam IE6, IE7, IE8, Firefox, Opera, Safari e Chrome. Ele só sai dos limites se você reduzir a janela para menos de 20 caracteres de largura.
Neste momento, você pode usar overflow:auto; (quando o código excede o limite do contêiner, a caixa de rolagem é exibida), mas esse método não é adequado para todos os navegadores convencionais e alguns navegadores truncarão diretamente o conteúdo excedido. pré {
espaço em branco: pré-envoltório; /* css-3 */
espaço em branco: -moz-pre-wrap; /* Mozilla, desde 1999 */
espaço em branco: -pre-wrap;
espaço em branco: -o-pre-wrap; /* Opera 7 */
quebra de linha: quebra de palavra; /* Internet Explorer 5.5+ */
}