css_23_多列布局

news/2024/7/1 7:53:21
  • 常用值:
    column-count:指定列数,值是数字。

column-width:指定列宽,值是长度。

columns :同时指定列宽和列数,复合属性;值没有数量和顺序要求。

column-gap:设置列边距,值是长度。

column-rule-style:设置列与列之间边框的风格,值与 border-style 一致。

column-rule-width:设置列与列之间边框的宽度,值是长度。

column-rule-color ::设置列与列之间边框的颜色。

coumn-rule :设置列边框,复合属性。

column-span: 指定是否跨列;

值: none 、all。

举例:

 .outer {width: 1000px;margin: 0 auto;/* 直接指定列数 */column-count: 5;/* 指定每一列的宽度,会自动计算列数 */column-width:220px ;/* 复合属性,能同时指定列宽和列数 */columns: 4;/* 调整列间距 */column-gap: 20px;/* 每一列的边框宽度 */column-rule-width: 2px;/* 每一列的边框风格 */column-rule-style: dashed;/* 每一列的边框颜色 */column-rule-color: red;/* 边框相关的复合属性 */column-rule: 2px dashed red;}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.cpky.cn/p/13625.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈,一经查实,立即删除!

相关文章

GPU设置

GPU降温测试 前提 同一个训练程序,使用8块GPU,GPU使用率基本全程>90%,GPU为1080 Ti 限制最高功率效果 不限制最高功率(默认最高功率250W):最高温度85,大多时间在75-85之间 将最高功率限制为150W:最高…

Go 与 Java 字符编码选择:UTF-8 与 UTF-16 的较量

💝💝💝欢迎莅临我的博客,很高兴能够在这里和您见面!希望您在这里可以感受到一份轻松愉快的氛围,不仅可以获得有趣的内容和知识,也可以畅所欲言、分享您的想法和见解。 推荐:「stormsha的主页」…

Thinger.io 支持多协议、插件化100%开源 IoT 企业级物联网平台

项目源码,文末联系小编 Thinger.io 是一个开源插件化物联网平台,提供了设备原型、扩展和设备连接管理所需的一切工具。我们的目标是使物联网的使用民主化,使其可供全世界使用,并简化大型物联网项目的开发。 01 Thinger.io 物联网平…

北邮《计算机网络》传输层笔记

内容一览 缩写复习单词复习传输层前言传输协议的要点拥塞控制UDPTCP VS UDPTCP 缩写复习 AIMD XCP ECN WFQ max-min-fair ARQ PAWS TSAP NSAP TCP UDP RTT SCTP SACK NAK RST MSS 单词复习 inverse multiplexing(SCTP) convergence crashed machine protocol scenarios asym…

Linux集群自动化维护-Ansible

1.1Ansible概述 自动化运维:批量管理,批量分发,批量执行,维护。。是python写的 批量管理工具: Ansible(无客户端):无客户端,基于ssh进行管理与维护 Saltstack &#…

第28讲:Ceph集群使用RBD块存储与K8S Volumes集成

文章目录 1.Ceph集群使用RBD块存储与K8S集成简介2.Ceph集群RBD块存储与K8S Volume集成2.1.在Ceph集群中创建K8S集群使用的块存储2.2.创建用于K8S访问Ceph RBD块设备的认证用户2.3.将认证用户的Key存储在K8S Secret资源中2.4.在K8S集群的所有节点中安装Ceph命令2.5.创建Pod资源使…