今天小编跟大家讲解下有关DIV+CSS 网页布局心得 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关DIV+CSS 网页布局心得 的相关资料,希望小伙伴们看了有所帮助。
我们在aidi.net.cn一直强调交流的重要性 只有通过交流才能发现自己的不足 才能明确的知晓自己到底掌握了多少知识 哪些地方不足 哪些地方已经掌握 今天与大家分享一位jb51网友的DivCSS网页布局心得。DIV+CSS是目前互联网网页制作最热门的方法 但对于完全手写代码 许多网页设计师都望而止步。其实DIV+CSS是很简单的一种布局方式 甚至比任何一种编程语言都要简单(虽然它不能算是编程语言)。 首先你要知道 当你开始学习DIV+CSS的时候 你要把以前所有用DW画布局表格的思维方法忘的一干二净(如果你以前是用TABLE布局的话) 然而这项技术更适合刚接触网页制作的人。 然后你要知道 DIV+CSS是高成本开发 速度当然是没有你画TABLE来的快 但是好处更多 相信如果你能看到这里 你一定对DIV+CSS的好处也有一定的了解了。 最后你还得知道 你所用的工具 你可能认为Dreamweaver很好 没错 它的确不错 但你要认识到 当你熟练使用了这门技术 你就可以在任何文本编辑器中编写网页 甚至在记事本中 而dreamweaver只是充当一个文本编辑器的角色 而你所有的工作基本都在代码视图中完成 在这里我推荐adobe最新的dreamweaver cs4。当然如果CS5出现了我也会去试用它。 切入正题 其实DIV+CSS正确的说法应该是XHTML+CSS 说成DIV的原因只是让它能更明确地和TABLE布局方法区分开来 并不是说一个页面里没有TABLE 而是在什么地方使用TABLE 你要认识到TABLE是表格 是存放数据用的 而不是用来布局的。 接下来是布局思维方式 可能大家在接触DIV+CSS的时候无从下手 我现在向大家推荐最著名的盒子模型 我也是看了这个模型后一下子就开窍了。 你可能会说 好多英文看不懂 不过我告诉你 很抱歉那三个英文你必须记住 而且是最重要的三个 你可以把这么个盒子看成一个DIV 而所有标签都带有这三个属性。 正如你所见到的这个是一个方块 而网页呢 是由这么多大大小小的方块组成的 可能以下实例会更明确的让你了解这个盒子。 我在这里借用了新浪博客的盒子来说明下 大家可能发现了 其实边框border往往就只有1px的宽度 谁叫它是边框呢。而外补丁margin呢 它代表了DIV(盒子)和DIV(盒子)之间的距离 而内补丁padding则是大盒子(DIV)和里面的盒子(DIV)的距离(盒子(DIV)里面可以放盒子(DIV)哦)。来源:爱蒂网