css自动换列
演示demo 2021-08-28 09:47:37

CSS自动换列，即高度固定的情况下，超出高度，到下一列

 

 

XML/HTML Code复制内容到剪贴板
  1. <!DOCTYPE HTML>  
  2. <html>  
  3.     <head>  
  4.         <meta charset="utf-8">  
  5.         <title>演示：使用CSS3制作漂亮的按钮</title>  
  6.         <style>  
  7.             div {  
  8.                 border: solid 1px #000  
  9.             }  
  10.   
  11.             #main-div {  
  12.                 width: 200px;  
  13.                 height: 300px;  
  14.                 writing-mode: vertical-lr;  
  15.             }  
  16.   
  17.             .item {  
  18.                 width: 100px;  
  19.                 height: 50px;  
  20.                 display: inline-block;  
  21.                 background-color: antiquewhite;  
  22.                 writing-mode: horizontal-tb;  
  23.             }  
  24.         </style>  
  25.     </head>  
  26.   
  27.     <body>  
  28.   
  29.         <div id="main-div">  
  30.             <div class="item">一条内容</div>  
  31.             <div class="item">一条内容</div>  
  32.             <div class="item">一条内容</div>  
  33.             <div class="item">一条内容</div>  
  34.             <div class="item">一条内容</div>  
  35.             <div class="item">一条内容</div>  
  36.             <div class="item">一条内容</div>  
  37.         </div>  
  38.   
  39.     </body>  
  40. </html>  

 

本文来自于：http://www.yoyo88.cn/demo/590.html

在线演示 (66)
上一篇 three.js —— 3D球体旋转
下一篇 CSS涟漪光圈+CSS小人跑步
相关的文章
Powered by yoyo苏ICP备15045725号