首页 > 网站 > WEB开发 > 正文

css3多列显示

2024-04-27 14:29:43
字体:
来源:转载
供稿:网友

CSS3多列显示

columen-width:定义单列显示的宽度。初始值是auto,适用于不可替代的块级元素,行内块元素和单元格,表格元素除外。

目前Webkit引擎支持-webkit-column-width,Mozilla Gecko引擎支持-moz-column-width;

作用:如果页面内容能够在单列显示就在单列显示,如果页面宽度足够宽,就多列显示。

column-count:

定义单列显示列数。初始值是auto,适用于不可替代的块级元素,行内块元素和单元格,表格元素除外。

目前Webkit引擎支持-webkit-column-count,Mozilla Gecko引擎支持-moz-column-count;

作用:无论浏览器页面宽度是多少,始终都按照定义的列数显示。

column-gap:

定义列的间距。初始值是normal(1em),适用于不可替代的块级元素,行内块元素和单元格,表格元素除外。

目前Webkit引擎支持-webkit-column-gap,Mozilla Gecko引擎支持-moz-column-gap;

作用:定义列之间的距离。

column-rule:<length>|<style>|<color>|<transparent>(边框透明度)

定义列边框的样式。适用于不可替代的块级元素,行内块元素和单元格,表格元素除外。

目前Webkit引擎支持-webkit-column-rule,Mozilla Gecko引擎支持-moz-column-rule;

作用:定义列边框的样式。

例如:虚线灰色边框

-webkit-column-rule:dashed 1px gray; -moz-column-rule:dashed 1px gray; column-rule:dashed 1px gray;

column-span:定义跨列显示 初始值1 适用于静态的、飞浮动元素。all 值横跨所有列,并定位在列Z轴上。

目前Webkit引擎支持-webkit-column-span,Mozilla Gecko引擎支持-moz-column-span;

column-fill:定义列高 初始值balance:适用于多列布局元素,各列的高度会根据内容最多的那一行的高度进行统一。

auto:各列的高度随其内容的变化而自动变化。

目前Webkit引擎支持-webkit-column-fill,Mozilla Gecko引擎支持-moz-column-fill;

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>css3多列显示</title><style type="text/css" media="screen"> body{ /*定义列宽为300像素,则网页中每个栏目的最大宽度为300px*/ -webkit-column-width: 300px; -moz-column-width:300px; column-width:300px; }

h1{color:#333333;padding:5px 8px;font-size:20px;text-align:center;padding:12px;

/*跨列显示*/ -webkit-column-span:all; -moz-column-span:all; column-span:all; } h2{font-size:16px;text-align:center; /*跨列显示*/ -webkit-column-span:all; -moz-column-span:all; column-span:all; }

p{color:#333333;font-size:14px;line-height:180%;text-indent:2em;}</style></head><body> <h1>《管道的故事》</h1> <h2>贝克.哈吉斯</h2> <p> 在新经济里,如何让一个人都可以建立一个持续世袭收入的管道?你可以成为邻家的百万富 翁! 亲爱的读者: 一百年前,普通人几乎不可能成为百万富翁。来看看这份在20世纪所做的生活水平状况调查 统计:在1900年,美国的平均薪水是每小时0。22美元,一般工人的年收入在200美元至多400 美元之间,处于当时的贫困线下。那时全美只有6%的高中毕业,平均寿命47岁。只有14%的家 庭拥有浴缸。全美只有8000部汽车,铺好的路面也只有144英里。直到第一次世界大战时,美 国普通家庭将收入的80%用在食物、住房、穿衣等基本需求上。 总的来说,100年前基本上只有两个经济阶层:富有阶层和其他阶层。10个家庭中只有一个 是富有阶层。他就是说,在1900年美国有90%的人被划分为贫困阶层。 中产阶级依然靠工资生活 现将镜头从百年前转向2001年。 现在,一般家庭的收入为47000美元。小汽车的数目超过了人口数目。大多数家庭至少拥有 二部电视。寿命长至75岁。现在,一般人有比以前更多可支配的收入,有更多的空余时间,有 更多的职业选择。 然而全美约7200万家庭的大部份依然靠工资生活。 除去家里住房、车及家具,一般的家庭资产为零。零!当收入增加时,家庭负债在增加,工 作时间也在增加。 哪里出了错? 你是否加入了一个错误的系统? 问题在于许多人加入了一个错误的计划当中。他们进入了一个错误的系统,缺乏如何建立和 积累财富的基本知识。 今天我要做一个或许会让你震惊的大胆声明。但这是绝对真实,且豪不含糊的。准备好了吗? 简单的、无须修饰的事实就是,今天,成为一名百万富翁是一种选择,而非机会。 是真的——今天,任何一个有中产阶级收入的人都可以成为一名百万富翁。不可能?不。事实上, 它很简单。 如果你今天想成为一名百万富翁,你所需要做的只是跟随以下三个步骤: 1. 明白财富是如何建立和积累的; 2. 复制已经被认实的建立财富的系统; 3. 在一段时间内持续不懈; 就这么多。这就是普通人积累百万资产所需要做的:认识、复制、坚持。 </p></body></html>


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表