CSS의 영어 단어 자동 줄바꿈 방법 소개

CSS는 영어 단어 자동 줄 바꿈을 허용합니다
웹 페이지를 만들고 CSS 스타일을 작성하는 과정에서 단어 줄 바꿈 문제가 발생할 수 있습니다. 그 중 영어 줄 바꿈은 많은 초보자에게 어려움을 줄 수 있습니다. 이에 대해 자세히 설명하려면 CSS를 공부한 친구들은 CSS에서 단어 나누기를 사용하여 텍스트 나누기 여부를 직접 조정할 수 있다는 것을 알아야 합니다. 그러나 영어의 경우 모든 브라우저의 요구를 충족하도록 만들어야 합니다. , 단지 이 속성만으로는 충분하지 않습니다.
제가 개인적으로 알고 있는 어떤 정보에 따르면, 영어가 너무 많고 너무 길면 형식뿐만 아니라 p에도 영향을 미칠 수 있습니다. 형식과 p에 대한 해결책이 다릅니다. 이 문제를 양식에서 해결하는 방법을 살펴보겠습니다.
테이블 레이아웃을 사용하고 테이블의 내용이 대부분 영어이고 영어가 줄 바꿈되지 않는 경우 CSS
테이블 {
테이블에 다음 코드만 추가하면 됩니다. 레이아웃 : 고정; word-break:break-all;
word-wrap:break-word;
}
p+css 레이아웃을 사용하는 경우 p의 텍스트가 영어로 깨지면 CSS
p{
word-break:break-all;
word-wrap:break-word
}
CSS2 중국어 매뉴얼에 따르면
word에 다음 코드를 추가할 수 있습니다. -break 버전: IE5+ 독점 속성 상속: yes
구문:
word-break: Normal | break-all | keep-all Break-all: 이 동작은 아시아 언어의 일반적인 동작과 동일합니다. 비아시아 언어 텍스트 줄의 모든 단어 내에서의 구분도 허용됩니다. 이 값은 일부 비아시아 텍스트가 포함된 아시아 텍스트에 적합합니다.
keep-all: 모든 비아시아 언어에 대한 일반 값과 ​​동일합니다. 중국어, 한국어, 일본어의 경우 단어 구분이 허용되지 않습니다. 소량의 아시아 텍스트가 포함된 비아시아 텍스트에 적합합니다.
설명:
개체 내 텍스트에 대한 단어 내 줄 바꿈 동작을 설정하거나 검색합니다. 특히 여러 언어가 나타날 때.
중국어의 경우 break-all을 사용해야 합니다.
이 속성은 currentStyle 개체에 대해 읽기 전용입니다. 다른 객체에서 읽고 쓸 수 있습니다.
해당 스크립트 기능은 wordBreak입니다.
예:
p {word-break : break-all; }
적용 대상:
IE5.0+
word-wrap 버전: IE5.5+ 독점 속성 상속: 있음
구문:
단어 줄 바꿈: 일반 | 단어 구분
값:
일반: 기본값. 콘텐츠가 지정된 컨테이너 경계를 깨도록 허용
break-word: 콘텐츠가 경계 내에서 분리됩니다. 필요한 경우 단어 구분도 발생합니다.
설명:
현재 줄이 지정된 컨테이너의 경계를 초과할 때 구분할지 여부를 설정하거나 검색합니다.
이 속성은 블록 개체와 같이 레이아웃이 있는 개체에만 작동합니다. 인라인 요소에서 이 속성을 사용하려면 먼저 객체의 높이 또는 너비 속성을 설정하거나 위치 속성을 절대 로 설정하거나 디스플레이 속성을 블록으로 설정해야 합니다.
이 속성은 currentStyle 개체에 대해 읽기 전용입니다. 다른 객체에서 읽고 쓸 수 있습니다.
해당 스크립트 기능은 wordWrap입니다.
예:
p { word-wrap: break-word; word-break: break-all; }
참고
break-word: 콘텐츠는 경계 내에서 래핑됩니다. 필요한 경우 word-break도 발생하므로
기본적으로 word-break는 분리되지 않지만 지난번에 잘못된 버전이 게시된 등 매우 긴 단어가 있는 경우에는 12개입니다. 역사상 가장 무서운 영어 단어도 줄로 나누어 테이블이 손상되는 것을 방지할 수 있습니다.
그러나 이것은 w3c에서 css2 표준으로 채택되지 않았기 때문에 Mozilla는 이 속성을 지원하지 않습니다. 모두가 영어 단어를 잘 쓴다면 Firefox는 단어를 분할하여 새 줄로 묶지 않아도 됩니다. 누군가 매우 긴 단어를 쓰면 Mozilla Firefox는 항상 새 줄을 끊지 않습니다.

위 내용은 CSS의 영어 단어 자동 줄바꿈 방법 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!