我正在使用DreamWeaver MX来创建我的网页。我使用嵌套表。一个主表只有一行和一列(W = 99%和H = n像素)和一个具有重复模式的背景图像。在第一主表内插入并居中的第二主表(W = 990像素和H = n像素)。这样,页面适合所有屏幕990xn像素,并且背景图像完成了漂亮的边框。
第二个主表有3个区域:顶部的标题区域(水平和与第二个主表格相同的宽度),左侧的菜单区域和右侧的文本区域,大于其他两个区域。我还有一个小的水平表,在标题区插入一行和三列。这是为了包含图片和标题的文本。还有一些其他小桌子:一个插在菜单底部的菜单区域,以便包含三个“关注此社交网络”按钮,在文本区域插入一个或几个小桌子以包含图片,一个小表格以包含Disqus评论。
一切都运转良好。我的网站的所有页面都显示为我想要的Chrome,Firefox,IE8和IE9。然后我将Disqus评论系统插入到一些页面中。带有Disqus评论系统的页面在Chrome和Firefox中显示得很好,但是在IE8和IE9中,它是一团糟,评论占据了所有宽度,并使我的网页的大部分内容消失。
为了在IE8和IE9中正确显示Disqus评论,我在包含Disqus评论的网页的第一行插入了过渡Doctype声明的代码:。这个动作让我能够在Chrome,Firefox,IE8和IE9中正确显示Disqus评论系统,但现在所有浏览器都存在一个小问题:我的水平细胞系之间有白色空格(空白行)第二个主表和最近的文本行(这就像一个额外的水平填充;初始垂直和水平填充保持不变)。这些不期望的空格中的每一个都具有段落的大小。
以下是两个可让您直观显示问题的网址:
重要提示:当我从页面上取下过渡DOCTYPE声明代码和Disqus评论系统时,表格会在所有浏览器上正确显示。
我的问题是:我应该怎么做才能删除这些空格?
我不知道如何使用CSS。请给我一个没有CSS的解决方案。如果唯一可用的解决方案包含CSS,请向我提供完整的代码以及我必须在我的网页中插入代码的确切位置。
答案 0 :(得分:0)
表格单元格顶部似乎有空段落(<p> </p>
) - 请参阅下面代码段的第二行:
<td width="235" height="821" valign="top" bgcolor="#FFFFFF">
<p> </p>
<ul>
<li><font color="#0000FF" size="2" face="Arial, Helvetica, sans-serif" align="left"><strong><font face="Courier New, Courier, mono"><a href="../index.htm">Akèy</a></font></strong></font></li>
</ul>
可以解释你的间距问题
答案 1 :(得分:0)
我在使用DreamWeaver MX时终于找到了一种WYSIWYG解决方案。这很简单。这个解决方案允许我删除多余的空格,并在构成我的文本区域的大单元格内部具有均匀的行间距。它特别允许我具有正常距离:a)在单元格的顶部边界和单元格中的第一行文本之间b)单元格中的最后一行文本和单元格的底部边界之间。我必须说,我在我的网站的所有页面中添加了过渡Doctype声明。这样,我的网站看起来更专业。
我做了什么:
在DreamWeaver MX中,我选择了我的第一个主表。 CellPad的号码为空(空白)。我把它设置为0.所以我有:CellPad = 0,CellSpace = 0,Border = 0。
我选择了第二张主表。我有CellPad = 3.我把它设置为2.所以我有:CellPad = 2,CellSpace = 0,Border = 0。
我选择了包含一行三列的标题表。中间的单元格有一张背景图片和一些文字(网站名称,网站网址和网站标语),以及在第四行文字中插入的四张非常小的海地国旗图片。左侧的单元格仅包含插入其中的图片。同意右边的单元格。对于我的标题表,我有:CellPad = 3,CellSpace = 3,Border = 0.我改变了这个,现在我有:CellPad = 0,CellSpace = 0,Border = 0.对于我的标题表,我也有:宽度= 100%,高度= 162像素,高度与中间单元格的背景图片相同。
我在标题表的左侧选择了图片(150x150像素):V Space =空白,H Space =空白,Border =空白。我设置:V空间= 0,H空间= 0,边界= 0.右侧的图像(137x150像素)。我选择了四个小(15x10像素)Haitian标志中的一个:V空格=空白,H空格=空白,边界= 1.我设置:V空间= 0,空格= 0,我让边界= 1.同上其他三个小海地国旗。
我左键单击了标题表左栏内的空格(光标在右边框或所包含图片的左边框上闪烁):W = 19%,H =空白。我设置H = 162.我左键单击了标题表中间栏内的空格:W = 62%,H =空白。我设置H = 162.我左侧点击了标题表中间栏内的空格:W = 19%,H = 162.没关系,没有必要改变。
我进入了“显示代码视图”,我将光标立即放在代码行中“height =&#34; 170&#34;”的右侧。我在“显示设计视图”中返回,我看到包含我的标题表的第二个主表的顶部单元格被选中:宽度=空白,高度= 170.我让宽度=空白,我设置高度= 162.我保存并且自动地,我的标题只有一行,而不是对应于不同高度的表格或单元格的几行。然后我走到我的页面底部,我将第二张主桌的高度拉伸到我的第一张主桌高度的最小可能和高度。
问题出在我的第二个主表的cellpad和cellpace以及它的顶部单元格高度。他们太高了。我不得不减少它们,因为它们相互添加并增加了单元格顶部边框和单元格中第一行文本之间的垂直空白。我不得不将我的标头表的cellpad和单元格空间设置为零,因为它们不是必需的。我可以为我的第二个主表设置cellpad = 0,但我的文本区域中的文本不太好阅读(太靠近垂直边缘)。所以我减少了这个单元格(从3到2),因为它也有助于白色空间a)在单元格的顶部边界和单元格中的第一行文本b)之间的单元格中的最后一行文本和细胞的下边界。
如果我可以单独设置一个表格单元格的填充而不是为整个表格设置填充,则可以完全防止多余的垂直空白区域。
将图片设置为零“V空间”和“H空间”并非真正必要,只是一种预防措施。
我观察到水平单元格线和最近的文本行之间的空白区域默认设置为两段之间的间距。如果这些cellpadding和cellspacing未设置为0,则将母表的cellpadding和cellspacing添加到此空白区域。
前景:
找到一种单独设置单元格的cellpadding的方法。
找到一种方法,使a)第一行文本(在表格单元格中)与紧邻上方的单元格边界之间的垂直距离低于两段之间间距的高度b)之间的垂直距离最后一行文本和下面单元格的边框低于两段之间间距的高度。
获取DreamWeaver的最新版本,因为我使用MX超过10年。现在必须有许多新的WYSIWYG选项才能获得我的网页所需的演示文稿。
在我有机会的时候学习如何使用CSS,因为很明显CSS提供了更多的可能性,并且据说嵌套表会减慢网页的加载速度。