CSS设计原则详解完整版.pdfVIP

CSS 设计的一些原则 大原则 DIV 布局 因为表格布局会使浏览器的兼容性产生很大问题，比如在手机，掌上电脑用户浏览表格布局会一片混乱，所以最好使 用 DIV+CSS 的布局，事实上我所有的客户，都是这样要求我的。 兼容性 对于一个好的 CSS 设计来说，必须保证所有的主流浏览器都能正常地显示， IE6+ ，Firefox ，Chrome ，Opera ，Safari ， 这些浏览器都要支持的。 CSS Hack 还记得 !important 吧，这个 CSS Hack 一度很流行呀，但是好的设计者，最好不要使用 CSS Hack 技术，因为不同 浏览器下 Hack 都不一样，说不定某次浏览器的升级使得你使用的 Hack 无效了呢。 目前流行的做法是，给 IE ，尤其是 IE6 单独做个 CSS 文件就好了，用新 CSS 覆盖掉老的，虽然有冗余，但是要比 CSS Hack 可读性好，也更容易修改。 Html 代码 !--[if lt IE 7] link rel=stylesheet type=text/css href=css/ie.css media=screen, projection / ![endif]-- 页面头部设计 一个页面在设计的时候，设计者就要想到，正确添加头部信息，保证所有必要的头部信息都存在，有些是 W3C 标准 所要求的，有些是 SEO 所需要的，下面就是一个典型的页面的头部设计。 Html 代码 !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtd html xmlns=/1999/xhtml xml:lang=en lang=en head meta http-equiv=content-type content=text/html; charset=utf-8 / title Title /title meta name=keywords content= / meta name=description content= / meta name=language content=en / meta name=author content= / meta name=copyright content=(c) Copyright 2009 All Rights Reserved / meta name=robots content=follow, all / !-- CSS -- link rel=stylesheet type=text/css media=screen, projection href=css/screen.css / !--[if lt IE 7] link rel=stylesheet type=text/css href=css/ie.css media=screen, projection / ![endif]-- !-- Javascripts -- !-- Favicon -- link rel=shortcut icon type=ima