>  기사  >  웹 프론트엔드  >  p 태그 텍스트 줄바꿈 여부 및 HTML에서 텍스트 숨기기에 대한 자세한 설명

p 태그 텍스트 줄바꿈 여부 및 HTML에서 텍스트 숨기기에 대한 자세한 설명

黄舟
黄舟원래의
2017-07-03 13:32:317034검색

우리는 웹 페이지를 레이아웃할 때 p 태그를 사용합니다. 일반적으로 p 태그에는 중국어 텍스트나 다른 국가의 텍스트가 포함됩니다. 텍스트 숨기기:
1. 영어 줄 바꿈

Div p{ word-break:break-all; width:150px;}/*只对英文起作用,以字母作为换行依据*/
Div p{ word-wrap:break-word; width:150px;}/*--只对英文起作用,以单词作为换行依据*/

때로는 영어 단어가 전체이므로 분리할 수 없다는 점에 유의하세요! ! !
2. 중국어 줄바꿈 및 강제 비줄바꿈

Div p{white-space:pre-wrap;width:150px;}/*只对中文起作用,强制换行*/
Div p{white-space:nowrap;width:10px;}/*强制不换行,都起作用*/

3. 강제 비줄바꿈 및 부분 텍스트가 너비를 초과하여 숨겨짐

.p5{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100px;}//*不换行,超出部分隐藏且以省略号形式出现*/


div 또는 p에 너비가 있어야 한다는 점에 유의하세요. 줄 바꿈을 허용하는 태그입니다. 그렇지 않으면 아무런 효과가 없습니다! ! !

p 태그 텍스트 줄바꿈 여부 및 HTML에서 텍스트 숨기기에 대한 자세한 설명

매개변수:
normal: 아시아 및 비아시아 언어의 텍스트 규칙에 따라 단어 내에서 줄바꿈을 허용합니다. ​​
break-all: 이 동작은 아시아 언어의 일반적인 동작과 동일합니다. 비아시아 언어 텍스트 줄의 모든 단어 내에서의 구분도 허용됩니다. 이 값은 일부 비아시아 텍스트가 포함된 아시아 텍스트에 적합합니다.
keep-all: 모든 비아시아 언어에 대한 일반 값과 ​​동일합니다. 중국어, 한국어, 일본어의 경우 단어 구분이 허용되지 않습니다. 적은 양의 아시아 텍스트가 포함된 비아시아 텍스트에 적합합니다

위 내용은 p 태그 텍스트 줄바꿈 여부 및 HTML에서 텍스트 숨기기에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.