CSS 디지털 텍스트가 너무 길어서 숨겨져 있으면 어떻게 해야 합니까?-CSS 튜토리얼-php.cn

CSS 디지털 텍스트가 너무 길어서 숨겨져 있으면 어떻게 해야 합니까?

青灯夜游

풀어 주다： 2023-02-17 15:01:51

원래의

3224명이 탐색했습니다.

너무 긴 숨겨진 CSS 숫자 텍스트에 대한 해결 방법: 1. 해당 HTML 파일을 엽니다. 2. "word-break" 속성을 사용하여 숫자가 포함된 요소에 "word-break:break-all;"을 추가합니다. , 디지털 텍스트 전체가 자동으로 래핑되어 표시될 수 있도록 합니다.

CSS 디지털 텍스트가 너무 길어서 숨겨져 있으면 어떻게 해야 합니까?

이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

연속적인 숫자 텍스트는 자동으로 줄 바꿈될 수 없습니다.

CSS 디지털 텍스트가 너무 길어서 숨겨져 있으면 어떻게 해야 합니까?

너무 길고 컨테이너 요소가 overflow:hidden; 스타일로 설정된 경우 초과 부분이 숨겨집니다. verflow: hidden;样式，那么超出的部分会被隐藏。

CSS 디지털 텍스트가 너무 길어서 숨겨져 있으면 어떻게 해야 합니까?

这时候我们，可以通过设置文本自动换行来将数字全部显示出来。

而想要设置自动换行，就需要使用word-break属性，该属性可以让浏览器实现在任意位置换行。

示例：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" id="remove">
		<style>
			div{
				width: 200px;
				height: 100px;
				border: 1px solid red;
				overflow: hidden;
				word-break:break-all;
			}
		</style>
	</head>

	<body>
		<div>11111111111111111111111111111111111111111111111</div>
	</body>
</html>

로그인 후 복사

效果图：

CSS 디지털 텍스트가 너무 길어서 숨겨져 있으면 어떻게 해야 합니까?

说明：

word-break 属性规定自动换行的处理方法。

语法：word-break: normal|break-all|keep-all;

이것 이때 텍스트가 자동으로 줄 바꿈되도록 설정하면 숫자를 모두 표시할 수 있습니다.
자동 줄 바꿈을 설정하려면 브라우저가 어느 위치에서나 줄 바꿈을 할 수 있도록 하는 word-break 속성을 사용해야 합니다.
예:
rrreee
렌더링:
설명:

word-break 속성은 자동 줄 바꿈 처리 방법을 지정합니다.

구문: word-break: Normal|break-all|keep-all;

normal 브라우저의 기본 줄 바꿈 규칙을 사용합니다.

break-all 단어 내에서 줄 바꿈을 허용합니다.

keep-all은 반자 공백이나 하이픈에서만 줄바꿈을 할 수 있습니다.

HTML이 발명된 이래로 스타일은 다양한 형태로 존재해 왔습니다. 다양한 브라우저는 자신만의 스타일 언어를 결합하여 사용자에게 페이지 효과를 제어할 수 있는 기능을 제공합니다. 원본 HTML에는 몇 가지 표시 속성만 포함되어 있습니다. 🎜🎜HTML의 성장과 함께 페이지 디자이너의 요구 사항을 충족하기 위해 HTML에는 많은 표시 기능이 추가되었습니다. 그러나 이러한 기능이 증가함에 따라 HTML은 점점 더 복잡해지고 HTML 페이지는 점점 더 비대해집니다. 그래서 CSS가 탄생했습니다. 🎜🎜이하쿤은 1994년에 CSS의 원래 제안을 제안했습니다. 당시 Bert Bos는 Argo라는 브라우저를 디자인하고 있었기 때문에 CSS를 함께 디자인하기로 결정했습니다. 🎜🎜사실 당시 인터넷 업계에서는 이미 스타일 시트 언어를 통합하자는 제안이 있었지만, "캐스케이딩(Cascading)"이라는 풍부한 의미를 지닌 최초의 스타일 시트 언어는 CSS였습니다. CSS에서는 한 파일의 스타일이 다른 스타일 시트에서 상속될 수 있습니다. 독자는 어떤 곳에서는 자신이 선호하는 스타일을 사용할 수 있고 다른 곳에서는 작가의 스타일을 상속하거나 "계단식" 적용할 수 있습니다. 이러한 계층적 접근 방식은 작성자와 독자 모두에게 자신만의 디자인을 추가하고 모두가 좋아하는 것을 혼합할 수 있는 유연성을 제공합니다. 🎜🎜하쿤은 1994년 시카고 컨퍼런스에서 처음으로 CSS를 제안했습니다. CSS는 1995년 www 네트워크 컨퍼런스에서 다시 제안되었습니다. 보스는 CSS를 지원하는 아르고 브라우저의 예를 시연했고, 하쿤도 CSS를 지원하는 아레나 브라우저를 선보였습니다. 🎜🎜같은 해에 W3C 조직(World WideWeb Consortium)이 설립되었습니다. CSS의 모든 창의적인 구성원이 W3C 작업 그룹이 되어 CSS 표준 개발에 총력을 기울였습니다. 마침내 올바른 궤도에 올랐습니다. . Microsoft의 Thomas Reaxdon을 비롯한 점점 더 많은 회원이 참여했으며 이들의 노력은 결국 Internet Explorer 브라우저에서 CSS 표준을 지원하게 되었습니다. 하쿤, 페르시아 등이 이 프로젝트의 주요 기술 리더입니다. 1996년 말 CSS의 첫 번째 초안이 완성되었으며 같은 해 12월에 Cascading Style Sheets(Cascading Style Sheets Level 1)에 대한 첫 번째 공식 표준이 완성되어 w3c에서 권장되는 표준이 되었습니다. 🎜🎜1997년 초, CSS를 담당하는 W3C 워킹 그룹은 첫 번째 버전에서 다루지 않은 문제를 논의하기 시작했습니다. 논의의 결과로 1998년 5월에 CSS 사양의 두 번째 판이 출판되었습니다. 🎜🎜관련 추천: "🎜css 비디오 튜토리얼🎜"🎜

위 내용은 CSS 디지털 텍스트가 너무 길어서 숨겨져 있으면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!