快速业务通道

css教程:美化网页段落的排版

作者 佚名技术 来源 CSS技术 浏览 发布时间 2012-03-05

上四篇的内容是把常用的XHTML标签拿出来介绍了一下,不是很详细。不过没关系,重点是要能先知道用他们,以后深入了再去细细研究更为详细的特性以及使用方法就容易多了。上篇已经说了在第五篇会开始讲CSS,刚开始讲不能讲得复杂,我们还是由浅入深,一步步来。还是那句话:先用起来,然后再去研究。即然我们第一篇讲的是段落,那我们这篇初讲CSS当然也还是要从段落开始,让我们的段落先漂亮起来。观看更多css教程请点这里。

在没有讲CSS之前我们先去想一下什么样的段落才看起来才是最舒服的?如果大家一时还没有什么想法或是还不清楚如何去分析这个问题不妨先看一下《网页设计技巧系列之一 浅谈文本排版》。不论如何至少我们的小学老师告诉我们每一段的第一行应该空两个字。这可能是我们接受到的第一个关于如何划分段落的方法。并且可能更多人已经产生了思维定式,认为段落必需要首行空两格。而我则认为区分段落的首要素同段距,其次才能是段落首行的处理。而首行的处理是否只有缩进两字呢?我个人认为不是,因为我们还可以用“首字下沉”、“首行突出两字”等来表现。有人会说:“首字下沉我就见过,比如作者的博客就用了这个效果,但是首行突出两字似乎有点奇怪。”然而事实上首行突出两字必不是作者发明的,在中国古代的奏本上就常采用这种格式,不同的是因为他们常需要在行首写上一些颂语,而要表达这种颂语就需要抬高其地位,比如“君”“圣上”等字眼,所以才会突出两字,久之则形成了一种特别的排版形式,这种形式现在的文体是用得少了,不过大家可以多多了解一下,方便以后表达不同的文体时可以用得着。

即然段距是段落区分的第一要素,那么我们就先来解决这个段距的的样式问题。即然是一段一段的那么我们每一段都是由一组<p></p>组合而成的,而我们的CSS只要通过对这个段落标签的描述就可以实现我们所需要的效果了。那么基本形式是:

  1. p {这里是样式描述内容}

 我们注意到了,在CSS中这个段落标签是不需要加尖括号的,只需要一个"p"即可以了。所有的标签都是如此处理。那么我们需要给每个段落设个段距,这里我们有两个描述属性,一个是padding,另一个是margin,这两个表现的效果看起来有点像,但是却有着本质上的区别,如果我们把段落表示成盒子,在这个盒子里装着一些东西,padding就是这些东西与盒子内侧边的距离,而margin则是盒子与盒子之间的距离

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号