| |
|
| |
 |
|
你未必知道的10个css技巧
|
|
| 日期：2005-7-27 11:28:35 来源:易特网络技术 编辑：黑鹰 点击： |
evolt.org作者之一trenton写的ten css tricks you may not know，还是非常有用处的，无论css新手还是老枪，有些技巧的确鲜为人知。你可以去看英文原版，词汇并不复杂。其实这篇文章有翻译的价值的，不过我最近比较懒，就简单用中文简述一下，其间会插入一些自己的经历和看法：
font的简写
css很多元素都有简写，font要特别和严格一些，font-size和font-family是必须的，而且要按照这个顺序。因为font用到的地方比较多，所以他可能特别提到。简写能有效减小你的css文件的体积。
class属性叠加
其实在class中可以同时加入多个属性，属性用空格隔开。例如：<p class="text side">...</p>这样<p>就继承了.text和.side的有效属性（冲突的地方会自动被排斥）。随便提一下kubrick主题中也有一个地方使用了这个方法。该文章回复的用户提到ie在处理多属性时可能存在问题。
border的缺省值
当你使用border简写时没有指定border-width和border-color时，border是有缺省值的，宽度为medium（大概3到4个象素），颜色为框内文本的颜色。
!important不理会ie
在css规则中，!important会使该规则额外优先，而ie却听不懂这条规则，那么在某些时候这个技巧会非常有用。
图片移魂大法
你先看看原文的叙述，我谈谈我的经历。哈哈，我最早在zeldman的blog上发现了这个技巧，注意他的导航条，鼠标悬停时空心字图片会变为实心，而实际上这是一张图片。呵呵，你再去分析一下他的css就知道了。
盒模式的另类hack法
ie6以前的版本都有对盒模式的错误理解。以前都是看用css的声音属性来处理ie6以下版本的效果，这次你可以看看另外一种方法，看上去更简单方便。
块元素居中
我们一般都使用指定块宽度再把左右margin设置为auto来居中。殊不知有时会在ie6之前的版本出现问题。去看看解决技巧，有css示例。
垂直居中
css对垂直居中比较弱，没有表格那么灵活。而且vertical-align这个属性你就是用了也是不起作用的。方法就在于用行高来解决，把行高设置为整个box的高度。
子容器的定位
css的奇妙除了可以让对象随处定位外，还可以让子容器也做得到。这个用处也很多。比如binary bonsai的导航条。
控制屏幕底部的背景色
这个请看原文的详细讲解了。
|
上一篇:dreamwavermx与asp.net(一)
下一篇:没有了
[发送给好友] [打印本页] [关闭窗口] [返回顶部] 转载请注明来源：http://www.iyit.net |
|
| 特别声明： 本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转载的文章有版权问题请联系编辑人员，我们尽快予以更正。 |
| 责任编辑： 黑鹰 |
投稿作者： 易特网络技术 |
| 信息来源： 易特网络技术 |
录入时间： 2005-7-27 11:28:35 |
| 浏览次数： |
投稿信箱： shtghy@163.com |
|
|
|
|
