摘要:   很多CSSer在学习之初,更加看重的是CSS知识以及CSS编码技巧,需要更加注重HTML文档的学习与研究,其实52CSS.com也一直强调HTML文档的语义和结构。这是CSS网页布局的基础。下面我们学习一下关于这方面的知识。通常有两种情况阻碍你的学习:   第一种可能是你还没有理解CSS处理页面的原理。在你考虑你的页面整体表现效果前,你应当先考虑内容的语义和结构,然后再针对语义、结构添加CSS。这篇文章将告诉你应该怎样把HTML结构化。   另一种原因是你对那些非常熟悉的表现层属性(例如:cellpadding,、hspace、align=”left”等等)束手无策,不知道该转换成对 应的什么CSS语句。 当你解决了第一种问题,知道了如何结构化你的HTML,我再给出一个列表,详细列出原来的表现属性用什么CSS来代替。   结构化HTML   我们在刚学习网页制作时,总是先考虑怎么设计,考虑那些图片、字体、颜色、以及布局方案。然后我们用Photoshop或者Fireworks画出来、切割成小图。最后再通过编辑HTML将所有设计还原表现在页面上。   如果你希望你的 阅读全文
posted @ 2008-12-01 16:10 猫子 阅读(114) 评论(0) 推荐(0) 编辑
摘要: CSS网页布局也可以算是一个系统的工作,DIVCSS网站的开发可能有多人协作,由一个团队来完成,这就涉及到很多规范性操作的问题,即使是一个人进行开发,也需要有一定的条理和规范,这是一篇转载自蓝色的文章,非常有效,作者总结了很多实用的经验,大家可以参考学习。 总论   本规范既是一个开发规范,也是一个脚本语言参考,本规范并不是一个一成不变的必须严格遵守的条文,特殊情况下要灵活运用,做一定的变通。但是,请大家千万不要随意更改规范。如果有任何问题,请及时与我联系,我会及时更改本规范的相关代码样例和文档。 基本要求   1. 在网站根目录中开设images common temp 三个子目录,根据需要再开设media 子目录,images目录中放不同栏目的页面都要用到的公共图片,例如公司的标志、banner 条、菜单、按钮等等;common 子目录中放css、js,、php、include 等公共文件;temp 子目录放客户提供的各种文字图片等等原始资料;media 子目录中放flash, avi, quick time 等多媒体文件 。   2. 在根目录中原则 阅读全文
posted @ 2008-12-01 15:52 猫子 阅读(95) 评论(0) 推荐(0) 编辑
摘要: 在网站设计的时候,应该注意css样式兼容不同浏览器问题,特别是对完全使用DIV CSS设计的网,就应该更注意IE6 IE7 FF对CSS样式的兼容,不然,你的网乱可能出去不想出现的效果! 所有浏览器 通用 height: 100px; IE6 专用 _height: 100px; IE6 专用 *height: 100px; IE7 专用 *+height: 100px; IE7、FF 共用 height: 100px !important; 一、CSS 兼容 以下两种方法几乎能解决现今所有兼容. 1, !important (不是很推荐,用下面的一种感觉最安全) 随着IE7对!important的支持, !important 方法现在只针对IE6的兼容.(注意写法.记得该声明位置需要提前.) 代码: 阅读全文
posted @ 2008-12-01 10:24 猫子 阅读(209) 评论(0) 推荐(0) 编辑
摘要: 对IE6、IE7、FF兼容性的详细CSS HACK介绍2007年12月05日 16:00以下为引用: 现在我大部分都是用!important来hack,对于ie6和firefox测试可以正常显示,但是ie7对! important可以正确解释,会导致页面没按要求显示!搜索了一下,找到一个针对IE7不错的hack方式就是使用“*+html”,现在用IE7浏 览一下,应该没有问题了。 现在写一个CSS可以这样: #example { color: #333; } /* Moz */ * html #example { color: #666; } /* IE6 */ *+html #example { color: #999; } /* IE7 */ 那么在firefox下字体颜色显示为#333,IE6下字体颜色显示为#666,IE7下字体颜色显示为#999,他们都互不干扰。我真希望那个IE6快点退休...... 阅读全文
posted @ 2008-12-01 10:12 猫子 阅读(244) 评论(0) 推荐(0) 编辑
摘要: 1.DOCTYPE 影响 CSS 处理   2.FF: div 设置 margin-left, margin-right 为 auto 时已经居中, IE 不行   3.FF: body 设置 text-align 时, div 需要设置 margin: auto(主要是 margin-left,margin-right) 方可居中   4.FF: 设置 padding 后, div 会增加 height 和 width, 但 IE 不会, 故需要用 !important 多设一个 height 和 width   5.FF: 支持 !important, IE 则忽略, 可用 !important 为 FF 特别设置样式,值得注意的是,一定要将xxxx !important 这句放置在另一句之上   6.div 的垂直居中问题: vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了。缺点是要控制内容不要换行 阅读全文
posted @ 2008-11-29 19:52 猫子 阅读(134) 评论(0) 推荐(0) 编辑