快速业务通道

网页设计教程:CSS文字排版技巧大全

作者 佚名技术 来源 CSS技术 浏览 发布时间 2012-02-26
derline)、上划线(overline)、删除线(line-through)以及文字闪动(blink)。

1
2
3
4
5
text-decoration: normal;
text-decoration: underline;
text-decoration: overline;
text-decoration: line-through;
text-decoration: blink;
预览
  1. text-decoration设置为normal
  2. text-decoration设置为underline
  3. text-decoration设置为overline
  4. text-decoration设置为line-through
  5. text-decoration设置为blink (只有Firefox 和Opera 支持)

Font-Variant

font-variant属性允许你制作小型大写字母效果,也就是将小写字母变成大写并减小字体型号

1
2
3
font-variant: normal;
font-variant: small-caps;
font-variant: inherit;
预览
  1. Font Variant 设置为 normal
  2. Font Variant 设置为 small-caps
  3. Font variant 设置为 inherit

Letter-Spacing 和 word-spacing

这两个属性都用来添加他们对应的元素中的空白。letter-spacing添加字母之间的空白,而word-spacing添加每个单词之间的空白。请注意,word-spacing对中文无效。

1
2
3
letter-spacing: normal;
letter-spacing: 2px;
letter-spacing: inherit;
预览
  1. Letter spacing 设置为 normal
  2. Letter spacing 设置为 2px
  3. Letter spacing设置为 inherit

font缩写

上面的font属性可以缩写,这样可以大大的提高你的css的效率。

1
font:font-style font-variant font-weight font-size[/line-height] font-family

请注意上面的缩写的书写顺序。另外,如果这里不设置line-height,元素的line-height将会被设置为默认的1,而不会从父级元素或body元素继承。使用缩写的时候,font-size和font-family是必须的,其它几项可根据情况不写。

制作有吸引力的段落

对于更有吸引力的段落排版,可以采用Robert Bringhurst的方法,它约定:用你的文字大小乘以30就可以得到段落的宽度。

比如如果你的文字大

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站: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号