CSS布局的注意事项
1、确定错误发生的位置
如果错误影响了整体布局,则可以逐个删除div块,直到删除某个div块后显示恢复正常,即可确定错误发生的位置。
2、检查CSS是否正确
检查一下有无拼写错误、是否忘记结尾的 } 等。可以利用CleanCSS来检查 CSS的拼写错误。CleanCSS本是为CSS减肥的工具,但也能检查出拼写错误。
3、利用border属性确定出错元素的布局特性
4、检查HTML元素是否有拼写错误 是否忘记结束标记 即使是老手也经常会弄错div的嵌套关系。可以用dreamweaver的验证功能检查一下有无错误。
使用float属性布局一不小心就会出错。这时为元素添加border属性确定元素边界,错误原因即水落石出。
5、是否重设了默认的样式?
某些属性如margin、padding等,不同浏览器会有不同的解释。因此比较好在开发前首先将全体的margin、padding设置为0、列表样式设置为none等。
6、是否忘记了写DTD
如果无论怎样调整不同浏览器显示结果还是不一样,那么可以检查一下页面开头。
7、float元素的父元素不能指定clear属性
MacIE下如果对float的元素的父元素使用clear属性,周围的float元素布局就会混乱。这是MacIE的知名的bug,倘若不知道就会走弯路。
8、float元素务必指定width属性
很多浏览器在显示未指定width的float元素时会有bug。所以不管float元素的内容如何,一定要为其指定width属性。
网页设计需要哪些工具?
(1)网页设计软件DreamweaverDreamweaver是由关国知名的软件开发商Macromedia公司推出的,针对专业网页设计者而特别开发的“所见即所得”可视化网页设计工具。目前,在世界上制作网页的群体中,它是备受Web开发人士推崇的网页设计工具。Dreamweaver MX版本在Dreamweaver4.0的从础上,进一步增强了Dreamweave:的代码控制和后台功能,格合了UltraDev, ColdFusion Studio, Homesite等出色软件,与原有的版本相比,其功能得到了一个吃跃的发展。
Dreamweaver MX在整合了上面提到的三个软件之后,不仅仅被用来制作网页,而且还可以开发大型的网站数据库应用系统。Dreamweaver MX使网页的设计者、代码编写者和网页开发者都拓宽了施展自己才能的舞台。
(2)网络动画制作软件FlashFlash MX也是Macromedia公司非常自豪的产品。Flash MX可以更好地为网页设计师和开发人员服务,帮助他们提高上作效率,创建丰富感染力的动画作品。
Flash MX的主要功能是制作网络动画这种动画不论是纯粹的动画,还是交互式的动画,都可以制作出令人日眩的效果。
(3)网络图像处理软件FireworksFireworks MX与Dreamweaver MX, Flash MX同称为“网页三剑客”。
Fireworks MX是用来设计和制作专业化界面图形的解决方案。在Fireworks MX中,可以在一个专业化的环境中创建与编辑网页图形、进行动画处理、添加高级交互功能以及优化图像。Fireworks MX中能够同时创建和编辑位图与矢量图两种图形,并且可以随时进行编辑。此外,在Fireworks MX中还有许多自动化的处理过程.这些程序化的设计大大提高了网页设计者的工作效率.
(4)易学易用的网页设计软件FrontPage
如果要推荐容易学习的网页设计软件,恐怕还是要数FrontPage。了解FrontPage的用户都知道,它是Office大家族中的一个重要成员.在制作网页时,它充分支持该家族中的其他成员Word, Excel,可以将它们的功能直接添加到网页上。