CSS에서 공백:nowrap을 사용하는 방법

white-space:nowrap은 일반적으로 특별한 상황에서 사용됩니다. 오늘은 모든 사람이 white-space:nowrap

DIV CSS 공백 norma nowrap 필수에 더 익숙해질 수 있도록 문법 구조와 기본 매개변수를 연구하겠습니다. 모든 텍스트 내용이 줄 바꿈 없이 한 행에 표시되도록 같은 줄에 텍스트를 입력합니다.

텍스트가 자동으로 줄바꿈되는 것을 방지합니다. CSS 너비가 아무리 설정되어 있어도 모든 텍스트가 한 줄에 표시됩니다. 특히 제목 목록의 경우 한 줄에 하나의 제목 내용만 표시하고 싶지만 때로는 너비가 제한되고 제목 텍스트가 너무 많아 width(너비)가 제한되어 텍스트가 자동으로 줄바꿈됩니다. 시간이 지나면 공백 스타일을 사용하여 행 표시를 줄 바꿈하지 않을 수 있습니다. 물론 과도한 텍스트 내용을 숨기기 위해 CSS overflow:hidden 스타일을 추가할 수 있습니다.

white-space 구문 및 구조

white-space 구문:

white-space: 일반 nowrap

white-space 매개변수:

normal: 기본 처리 방법

nowrap: 강제로 모든 텍스트가 동일하게 표시됩니다. 줄까지 텍스트는 끝나거나 br 태그 개체 를 만날 때까지 중단됩니다. 줄바꿈을 강제로 하지 않으려면 공백:nowrap을 사용하는 것이 좋습니다.

white-space 설명:

white-space는 개체 내에서 텍스트 표시 모드를 설정하거나 검색합니다. 보통 우리는 내용을 한 줄에 표시하도록 강제하기 위해 사용합니다

보통 우리는 white-space:nowrap을 사용하여 텍스트 내용이 줄 바꿈되지 않도록 강제하고 객체 내에서 모든 텍스트 내용을 한 줄에 표시합니다.

공백 연습 사례

2개의 개체 상자를 설정했는데, 한 가지 설정으로 피어가 텍스트 내용을 표시하도록 했습니다. 두 번째 설정은 피어를 강제로 표시하지만 html br 태그를 사용하여 효과를 관찰합니다. 공백 대소문자 적용 효과를 위해 CSS 너비를 120px, CSS 높이를 60px, CSS line-heightline-height를 20px로 설정했습니다.

1. CSS 코드

2. HTML 코드 조각

콘텐츠가 한 줄로 완전히 표시됩니다

콘텐츠가 래핑됩니다 br

을 사용하면
줄 바꿈

으로 표시되지 않습니다.

white-space 강제 줄 바꿈 및 br 강제 줄 바꿈 CSS case

white-space 강제 줄 바꿈 없음 줄바꿈 및 강제 br 태그 줄 바꿈

일상생활에서 텍스트 내용을 한 줄로 표시하려면 너비가 부족하더라도 줄 바꿈을 사용할 수 없습니다. 공백을 설정했는지 여부에 관계없이 html br 강제 줄 바꿈 태그가 표시됩니다. 강제 개행 태그입니다.

관련 읽기:

Div와 CSS를 배우는 방법

css의 위치를 ​​사용하는 방법

CSS의 최소 너비와 최대 너비를 설정하는 방법

위 내용은 CSS에서 공백:nowrap을 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!