Code Thuộc tính column-count trong CSS

Code Thuộc tính column-count trong CSS

Code Thuộc tính column-count trong CSS

Tự code rồi chạy thử... Chạy Thử 
<!DOCTYPE html>
<html>
<head>
<title>Code Thuộc tính column-count trong CSS</title>
<style>
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.divcha{width:100%; height:auto; margin-bottom:10px;}
</style>
</head>
<body>

<h1>Code Thuộc tính column-count trong CSS</h1>
<p>Chia nội dung ra theo số cột được chỉ định, chiều rộng cột tự động phụ thuộc theo chiều rộng của phần tử cha, có thể quy định thêm khoảng cách giữa các cột và đường viền giữa các cột:</p>

<h4>column-count: 3; Chia nội dung làm 3 cột</h4>
<div class="divcha" style="column-count: 3;">
   Hãy Chạy thử Code Thuộc tính column-count trong CSS, Web Mới cung cấp công cụ giúp bạn chạy trực tiếp code và xem kết quả
</div>

<h4>column-count: 4; Chia nội dung làm 4 cột</h4>
<div class="divcha" style="column-count: 4;">
   Hãy Chạy thử Code Thuộc tính column-count trong CSS, Web Mới cung cấp công cụ giúp bạn chạy trực tiếp code và xem kết quả
</div>

<h4>column-count: 3; column-gap: 140px; Chia nội dung làm 3 cột, khoảng cách giữa các cột 140px</h4>
<div class="divcha" style="column-count: 3; column-gap: 140px;">
   Hãy Chạy thử Code Thuộc tính column-count trong CSS, Web Mới cung cấp công cụ giúp bạn chạy trực tiếp code và xem kết quả
</div>

<h4>column-count: 3; column-gap: 140px; column-rule: 1px solid #ccc; Chia nội dung làm 3 cột, khoảng cách giữa các cột 140px, vẽ đường viền màu xám giữa các cột</h4>
<div class="divcha" style="column-count: 3; column-gap: 140px; column-rule: 1px solid #ccc;">
   Hãy Chạy thử Code Thuộc tính column-count trong CSS, Web Mới cung cấp công cụ giúp bạn chạy trực tiếp code và xem kết quả
</div>

</body>
</html>
Code Thuộc tính column-count trong CSS nằm trong bài viết Thuộc tính column-count trong CSS