小魔女 发表于 2015-1-16 00:03:21

来谈谈:CSS3教程(6):创立网站多列

在网页制作中,有许多的术语,例如:CSS、HTML、DHTML、XHTML等等。在下面的文章中我们将会用到一些有关于HTML的基本知识。
利用CSS3能够为你的网站创立多列,而不必为每列制订特定的层或段落。
上一篇文章:CSS3教程(5):网页背景图片
与多背景图片一样,CSS3多列也是我最喜好的一个手艺。我想这条CSS3属性有在报纸和杂志结构中之外的良多潜伏的用处。假如你在某个设法或团体网站中利用了这类办法,请鄙人面的批评中提交你的链接,我很乐意能确认这类办法能用于良多中结构中。
跨扫瞄器兼容性:
对照好的撑持CSS3多列的扫瞄器有Firefox、Safari、GoogleChrome,如许我们就必要利用-moz和-webkit前缀了。
CSS3多列(宽度)


下面的截图是利用了上面的CSS3款式的效果:
#multiColumnWidth{text-align:justify;-moz-column-width:20em;-moz-column-gap:2em;-webkit-column-width:20em;-webkit-column-gap:2em;}扫瞄器撑持:


[*]Firefox(3.05+…)
[*]GoogleChrome(1.0.154+…)
[*]GoogleChrome(2.0.156+…)
[*]InternetExplorer(IE7,IE8RC1)
[*]Opera(9.6+…)
[*]Safari(3.2.1+windows…)
CSS3多列(列数)


下面的截图是利用了上面的CSS3款式的效果:
#multiColumnCount{text-align:justify;-moz-column-count:3;-moz-column-gap:1.5em;-moz-column-rule:1pxsolid#dedede;-webkit-column-count:3;-webkit-column-gap:1.5em;-webkit-column-rule:1pxsolid#dedede;}扫瞄器撑持:


[*]Firefox(3.05+…)
[*]GoogleChrome(1.0.154+…)
[*]GoogleChrome(2.0.156+…)
[*]InternetExplorer(IE7,IE8RC1)
[*]Opera(9.6+…)
[*]Safari(3.2.1+windows…)

业界越来越关注DIV+CSS的标准化设计,大到各大门户网站,小到不计其数的个人网站,在Div+CSS标准化的影响下,网页设计人员已经把这一要求作为行业标准。

谁可相欹 发表于 2015-1-18 05:00:23

HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器)

不帅 发表于 2015-1-25 20:47:36

俗话说:兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中,我们难免会遇到各种各样的问题。

兰色精灵 发表于 2015-2-4 05:58:18

学Dreamweaver技术的过程其实是一个增加信心的过程。

若相依 发表于 2015-2-9 16:32:49

不管老师做怎样的解释,而我却对它感到很是吃力,诸如里面有许多不知道的功能。

若天明 发表于 2015-2-27 11:36:35

由CS4 版本开始,则转用WebKit 排版引擎(亦即Google Chrome和Apple Safari浏览器所用的排版引擎)作为网页预览。

飘飘悠悠 发表于 2015-3-9 06:57:32

dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS,三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。

灵魂腐蚀 发表于 2015-3-16 22:29:21

由CS4 版本开始,则转用WebKit 排版引擎(亦即Google Chrome和Apple Safari浏览器所用的排版引擎)作为网页预览。

愤怒的大鸟 发表于 2015-3-23 08:34:07

不管老师做怎样的解释,而我却对它感到很是吃力,诸如里面有许多不知道的功能。
页: [1]
查看完整版本: 来谈谈:CSS3教程(6):创立网站多列