| 表格对决CSS--一场生死之战 |
|
作者：网络 文章来源：转载 点击数： 更新时间：2006-1-4  |
| [ 字体：缩小 正常 放大 | 双击自动滚屏 ] |
请选择合适的字体颜色：
|
|
|
好了，现在可以开始代码了。 第二阶段："用以前的做法，使用透明的GIF图片来控制间距." 如果你已经是一位参加过多个项目的网页设计师，下面的结构是你再熟悉不过的： <table bgcolor="#ffffff" cellspacing="0" cellpadding="0" border="0" align="center" width="200"> <tr> <td colspan="3" bgcolor="#545454"><img src="/Files/BeyondPic/jcwcj/2005-12/10/05121012380289153.gif" width="1" height="1" alt=""></td> </tr> <tr> <td bgcolor="#545454"><img src="/Files/BeyondPic/jcwcj/2005-12/10/05121012380289153.gif" width="1" height="1" alt=""></td> <td width="100%" align="center">Content goes here.</td> <td bgcolor="#545454"><img src="/Files/BeyondPic/jcwcj/2005-12/10/05121012380289153.gif" width="1" height="1" alt=""></td> </tr> <tr> <td colspan="3" bgcolor="#545454"><img src="/Files/BeyondPic/jcwcj/2005-12/10/05121012380289153.gif" width="1" height="1" alt=""></td> </tr> </table> 用表格说话，我们已经习惯于用它了，因为它是我们最基本的"积木块"。例如：用透明的GIF图片来控制间距、用表格的各种属性来控制位置。有人这么解释：表格是可靠的，用表格布局的页面可以向前兼容！没有css敢与表格对抗，表格可以适合所有浏览器等等。 让我们开始一步一步再现整个设计过程。 第1小时 噢。好象时光倒流，不用CSS我们用什么来定义背景颜色?哦，对...是bgcolor，谢谢提示。好，开始制作表格，预览效果。我定义了"align=center"，这样就可以在所有浏览器中居中，太好了，这多么简单！表格看上去好象并不坏，我有与老友重逢的感觉。我熟练地使用透明的GIF图片来控制间距，工作飞速前进！恩？在header和菜单之间怎么会出现空白呢？哦，原来在images代码后面多了一个空格，IE浏览器会把它显示出来。这改起来简单，删除空格就好了。 第2小时 我使用javaScript制作导航菜单的翻转效果： <td ... onMouseOver="chBg(this);" onMouseOut="chBg2(this);" >...</td> JavaScript这样写: function chBg(obj) { obj.bgColor = "#E1E5DB"; } function chBg2(obj) { obj.bgColor = "#CBD1C3"; } 除了我对老设计方法有点忘记以外，整个进度还是相当快的。虽然，我尽量减少表格的嵌套，但代码看上去还是有些复杂，所以我加了一些注释上去，以方便找到我们需要修改的地方。 上一页 [1] [2] [3] [4] [5] [6] 下一页
|
|
| 文章录入：54iter 责任编辑：54iter |
上一篇文章： CSS 循序渐进（二）字的艺术
下一篇文章： 使用Web标准建站第7天：CSS入门 |
| 【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】 |
