CSS에서 줄 바꿈 없이 영어를 얻는 방법

CSS에서 영어 금칙을 달성하는 방법: 먼저 HTML 샘플 파일을 만든 다음 본문에 일부 영어 콘텐츠를 정의하고 마지막으로 "white-space:nowrap;" 속성을 추가하여 영어 금칙 효과를 얻습니다.

이 기사의 운영 환경: Windows7 시스템, HTML5&&CSS3 버전, Dell G3 컴퓨터.

CSS는 영어, 중국어 줄 바꿈을 강제하고 줄 바꿈을 하지 않습니다

HTML을 디자인하고 만들 때 CSS가 영어, 중국어 줄 바꿈을 강제하고 줄 바꿈을 하지 않는 문제에 직면하게 됩니다. 이를 통해 관련 지식을 배울 수 있습니다. 기사.

구조:

1.환적 예약 시스템은 문자를 줄 바꿈으로 사용하여 영어로만 작동합니다.

2.환적 예약 시스템은 단어를 줄 바꿈으로 사용하여 영어로만 작동합니다.

3.환적 예약 시스템은 강제 줄 바꿈으로 중국어로만 작동 시작

4. 강제 줄 바꿈으로 환적 예약 시스템이 시작됩니다.

5. 줄 바꿈이 없으면 초과 부분이 숨겨져 타원 형태로 나타납니다

5. 줄 바꿈 없이 부분적으로 숨겨져 줄임표 형태로 나타나는 환적 예약 시스템이 출시되었습니다

코드:

.p1{ word-break:break-all; width:150px;}/*문자를 사용하여 영어로만 작동합니다. 줄 바꿈으로*/

.p2{ word-wrap:break-word; width:150px;}/*--단어를 줄 바꿈의 기초로 사용하여 영어로만 작동합니다*/

.p3{white-space :pre-wrap; width:150px ;}/*중국어에서만 작동, 강제 줄 바꿈*/

.p4{white-space:nowrap; width:10px;}/*줄 바꿈 없이 강제, 모든 유형에 작동* /

.p5{white-space: nowrap; Overflow:hidden; text-overflow:ellipsis; width:100px;}//*줄 바꿈 없음, 초과 부분은 숨겨지고 타원 형태로 표시됨*/

1. word-break:break-all; 문자를 줄 바꿈의 기초로 사용하여 영어에서만 작동합니다

2. word-wrap:break-word; 단어를 줄 바꿈의 기초로 사용하여 영어에서만 작동합니다. 3.{white-space:pre-wrap; 줄 바꿈을 강제하는 중국어에서만 작동합니다.

4.{white-space:nowrap; 줄 바꿈을 강제하지 않습니다. 모두 작동합니다

5.{white-space:nowrap; :hidden; text-overflow:ellipsis; 줄바꿈 없음, 초과된 부분은 숨겨지고 줄임표 형태로 표시됩니다.

컨테이너의 너비를 지정해야 합니다. 그렇지 않으면 쓸모가 없습니다.

word-break는 IE5+ 독점 속성입니다

구문: ​​

word-break : normal | break-all | keep-all

매개변수:

normal: 아시아 및 비아시아 언어의 텍스트 규칙에 따라 단어 내 줄 바꿈이 허용됩니다

break-all : 이 동작은 아시아와 일치합니다. 언어 정상은 동일합니다. 비아시아 언어 텍스트 줄의 모든 단어 내에서의 구분도 허용됩니다. 이 값은 일부 비아시아 텍스트가 포함된 아시아 텍스트에 적합합니다.

keep-all : 모든 비아시아 언어에 대한 일반 값과 ​​동일합니다. 중국어, 한국어, 일본어의 경우 단어 구분이 허용되지 않습니다. 소량의 아시아 텍스트가 포함된 비아시아 텍스트에 적합합니다.

설명:

개체 내의 텍스트에 대한 단어 내 줄 바꿈 동작을 설정하거나 검색합니다. 특히 여러 언어가 나타날 때.

중국어의 경우 break-all을 사용해야 합니다.

【추천 학습:

css 동영상 튜토리얼

】

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