chisdy.A.Pro

好长时间没整过DIV+CSS站点了，最近弄了下，感觉有点吃力了。发觉很多基础方面的东西都不牢固，每次遇到问题只会复制代码，没去真正研究下为什么。因为有遇到关于自适应布局方面的问题，所以分享几个也许大家都很熟悉的站点。

http://layouts.ironmyers.com/这个站点里有很多布局上的实例，可以说是CSS模板吧，研究下直接套用就行了，不过个人觉得有点繁琐，还是搞清楚来龙去脉，自己写比较好。

http://css.maxdesign.com.au/ 这个站点里也挺多好玩的东西，不过要研究完还是要花点时间，每次我都是挑选着去看，去做实例，也许是这样CSS布局方面才一直停滞不前吧。

http://www.intensivstation.ch/en/templates/ 这里也有几个布局，大体上差不多，有兴趣的再自己去了解。

写到这里才发现，其实没什么好介绍的。

IE8出到现在还没敢装，前些天下载了个Xenocode Browser Sandbox安装了下，发现之前一直用的一个纯CSS横向导航的水平居中出了问题，在IE8下完全居左了。找了很久没发现问题所在，索性每份CSS分开屏蔽，最终确定是针对IE的CSS问题，得避掉IE8只对IE7及以下版本设置。

之前只是针对所有的IE浏览器：

<!--[if IE]>
  <link href="Style/IE.css" rel="stylesheet" type="text/css" />
<![endif]-->

要避掉IE8的话就得：

<!--[if lt IE 8]>
  <link href="Style/IE.css" rel="stylesheet" type="text/css" />
<![endif]-->

lt在此作小于用，也就是小于IE8的版本都能识别。

或者：

<!--[if lte IE 7]>
  <link href="Style/IE.css" rel="stylesheet" type="text/css" />
<![endif]-->

lte在此作小于及等于用，也就是小于及等于IE7的版本能识别。

或者：

<!--[if !(IE 8)]>
  <link href="Style/IE.css" rel="stylesheet" type="text/css" />
<![endif]-->

<!–[if !(IE 8)]><![endif]–>在此单独避掉IE8版本。
Continue reading »

文章转自：http://www.yeeyan.com/articles/view/toydime/30047

原文：http://net.tutsplus.com/tutorials/html-css-techniques/5-tips-to-writing-better-css/

简介：当然，每个人都可以编写CSS代码，甚至你现在已经让它为你的项目工作了。但是CSS还可以更好吗？开始用这5个Tips改进你的CSS吧！

1.重置

首先，很认真的告诉你，总是要重置某些分类。无论你是使用 Eric Meyer Reset、YUI Reset，或者你自己编写的重置代码，只要使用就对了。 它能很简单的移除所有元素的填充（padding）和边距（margin）：

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote,
pre, form, fieldset, table, th, td { margin: 0; padding: 0; }

Eric Meyer Reset和YUI Reset都是非常强大的，但是对于我而言，它们走的太远了。我觉得你最终需要重置一切，然后重新定义所有元素的属性。这就是为什么Eric Meyer推荐更有效的使用（重置样式表），而你不要只是使用他的重置样式表，将它拖放到你的项目中。调整它（的重置样式表），建立属于自己的重置样式表。

噢，请停止使用：

* { margin: 0; padding: 0; }

花更多的时间去制作它，当你移除了填充（padding）你认为单选按钮会发生什么变化？表单元素有时能够做些时髦的事情，所以最有效的方式就是将他们独立。

Continue reading »