CSS에서 텍스트를 열로 나누는 방법
- 青灯夜游원래의
- 2021-07-07 16:55:404704검색
css에서 열 속성이나 열 너비 및 열 개수 속성을 사용하여 텍스트를 열로 나눌 수 있습니다. "열: 열 너비 및 열 수;" 또는 "열 너비: 값; 열"만 추가하면 됩니다. -count"를 텍스트 요소에 추가합니다. :value;" 스타일이면 충분합니다.
이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.
CSS에서는 열 속성이나 열 너비 및 열 개수 속성을 사용하여 텍스트를 열로 나눌 수 있습니다.
CSS가 텍스트 열을 구현하는 방법을 알아보기 위해 아래 코드 예제를 살펴보겠습니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
div{
margin:20px 10px;
}
.div1
{
columns:100px 3;
-webkit-columns:100px 3; /* Safari and Chrome */
-moz-columns:100px 3; /* Firefox */
}
.div2
{
column-count:4;
column-width:100px;
-moz-column-count:4; /* Firefox */
-moz-column-width:100px; /* Firefox */
-webkit-column-count:4; /* Safari and Chrome */
-webkit-column-width:100px; /* Safari and Chrome */
}
</style>
</head>
<body>
<div class="div1">
当我年轻的时候，我梦想改变这个世界；当我成熟以后，我发现我不能够改变这个世界，我将目光缩短了些，决定只改变我的国家；当我进入暮年以后，我发现我不能够改变我们的国家，我的最后愿望仅仅是改变一下我的家庭，但是，这也不可能。当我现在躺在床上，行将就木时，我突然意识到：如果一开始我仅仅去改变我自己，然后，我可能改变我的家庭；在家人的帮助和鼓励下，我可能为国家做一些事情；然后，谁知道呢?我甚至可能改变这个世界。
</div>
<div class="div2">
当我年轻的时候，我梦想改变这个世界；当我成熟以后，我发现我不能够改变这个世界，我将目光缩短了些，决定只改变我的国家；当我进入暮年以后，我发现我不能够改变我们的国家，我的最后愿望仅仅是改变一下我的家庭，但是，这也不可能。当我现在躺在床上，行将就木时，我突然意识到：如果一开始我仅仅去改变我自己，然后，我可能改变我的家庭；在家人的帮助和鼓励下，我可能为国家做一些事情；然后，谁知道呢?我甚至可能改变这个世界。
</div>
</body>
</html>Rendering:
설명:
columns 속성은 하나의 명령문에서 열 너비(column-width)와 열 개수(column-count)를 동시에 설정할 수 있는 단축 속성입니다. .
column-width 속성: 열 너비 설정
column-count 속성: 열 수 설정
(동영상 공유 학습: css 동영상 튜토리얼)
위 내용은 CSS에서 텍스트를 열로 나누는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.