pre 태그는 HTML 콘텐츠의 형식을 그대로 유지하지만 너비가 너무 크면 페이지가 깨집니다. 이때 자동 줄 바꿈이 필요합니다.
Wrapping the pre tagMaking preformated text wrap in CSS3, Mozilla, Opera and IEis the tip that let's you use the pre tag to keep the formatting,
without cursing yourself when some of the content is too long and doesn't wrap:
pre {white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
}상위 태그에 DIV를 추가하고 CSS속성을 설정하는 것이 가장 좋습니다. word-wrap: break-word: Normal; 스타일 쓰기:
<pre style="width:30px;word-break: break-all; word-wrap:break-word;border:1px solid #555"> asfasdfas dfasd fa sdfasdf
기사에서는 사전 형식 출력 코드가 사용되었습니다. 기본적으로 브라우저는 사전 내용이 줄 바꿈 없이 출력되도록 강제합니다. 이 경우 코드가 커지면서 페이지 외부로 확장되는 것처럼 보입니다. 이전에는 의도적으로 코드에 줄 바꿈을 강요했습니다... 피곤합니다. 오늘은 의도적으로 검색하여 다음을 발견했습니다.
pre {
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;word-wrap: break-word;}테스트 후 IE [현재 6 사용]을 제외하고 다른 모든 항목은... 우울합니다. width:600px;를 추가하면 줄이 끊어집니다. 실제로 위치는 여전히 파생됩니다. 다음과 같습니다. 코드는 들어 있지만 그 아래의 설명은 빠져 있습니다. 즉, 이 너비를 정의하는 것은 기본적으로 CSS를 직접 변경하지 않는 다른 방법은 없습니다. 그러다가 위의 CSS를 보고 생각했습니다. 다른 것을 정의할 때는 공백을 사용하고 IE를 정의할 때는 공백을 사용하지 않는 이유는 IE가 지원하지 않는 것이 아니기 때문입니다. . 그러니 그냥 추가하세요. [Google의 처음 5페이지를 살펴보았는데 CSS를 변경하여 해결할 수 있는 해결책을 찾을 수 없었습니다...].
pre {
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;white-space: -o-pre-wrap;word-wrap: break-word;
white-space : normal ;
}이 사이트에서 사용하는 것은 IE가 다른 것과 분리되어 있는데, 공백은 결국 다른 것에도 영향을 주기 때문입니다....
pre {
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap; }
* html pre {
word-wrap: break-word;
white-space : normal ;
}위 내용은 사전 태그 래핑을 자동으로 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
