用户界面
易用性检查
整理和优化
字体
表单
布局
酷站
帮助向导 / Hacks / 学习资源
- SelectOracle
Explains the structure of CSS- and HTML-documents. Enter semi-colon separated selectors or just paste in your existing rulesets into the “Direct Input area, or provide the URL of a stylesheet or an HTML document with an embedded stylesheet in the “URL Input area. English, Spanish, German and Bulgarian versions are available. - Tom Lee has a tutorial on Max-width in IE Using a CSS Expression. Word of caution: I hear using this method can be rather hairy, in some cases crashing the browser.
- Future-proof your CSS with Conditional Comments from Bruce Lawson is a great comprehensive collection of CSS’s that, when combined, addresses most of CSS issues with different browsers.
- IE Word Wrap Doppelganger Bug
这个站点展示了标题(heading)元素在IE6中换行时会留个小尾巴的bug。 - Images, Tables, and Mysterious Gaps seems like something I should’ve known already about the behavior of inline elements in strict mode. But of course it took me an hour of agony before finally realizing the ultimate truth: I’m not that smart.
- Easy CSS hacks for IE7 — IE7下可以用的CSS Hacks。
- 针对IE7, Firefox 1.5和Opera 8.5的Web浏览器CSS支持 一览表。
- snook.ca on the “+ CSS hack which you can use to target IE6 and IE7 only.
- On having layout
提供了很多信息围绕IE其特有的“渲染概念：hasLayout — one of the major causes for headache when it comes to how IE decides to pain the boundaries of certain HTML elements:
- “Internet Explorer 中有很多奇怪的渲染问题可以通过赋予其“layout得到解决。John Gallant 和 Holly Bergevin 把这些问题归类为“尺寸bug(dimensional bugs)，意思是这些 bug 可以通过赋予相应元素某个宽度或高度解决。这便引出关于“layout的一个问题：为什么它会改变元素的渲染特性，为什么它会影响到元素之间的关系？这个问题问得很好，但却很难回答。在这篇文章中，我们专注于这个复杂问题会有那些方面的表现，某一方面的具体讨论和范例请参考文中给出的相关链接。
这篇文章的中文翻译参见承志的SharkUI：On having layout
- Negative text-indent and underline — No matter how far on the left the real text is, the underline will be stretched all the way to the right in some PC browsers, namely the Firefox.
- IE6 Multi Class Bug — Again, something that could’ve brought to my attention last week!
- …Internet Explorer fails to render backgrounds for elements that have both an ID and a class defined. For instance, #photos.background1 will display the corresponding background in IE6 for Windows, but once that has been defined, #photos.background2, #photos.background3, etc. will not be displayed.
小贴士
