Html Can';t删除表中的边框间距
我希望图片和所附示例中的灰色区域粘在一起,并且高度相同,但我似乎无法删除破坏这一点的边界间距 你知道我做错了什么吗?对不起,样式表太乱了 PS:我知道div可以解决这个问题,但这是一个非常特殊的环境Html Can';t删除表中的边框间距,html,html-table,padding,border-spacing,Html,Html Table,Padding,Border Spacing,我希望图片和所附示例中的灰色区域粘在一起,并且高度相同,但我似乎无法删除破坏这一点的边界间距 你知道我做错了什么吗?对不起,样式表太乱了 PS:我知道div可以解决这个问题,但这是一个非常特殊的环境 <!doctype html> <html> <head> <meta charset="UTF-8"> <style> body { background-color: #efefef; border: 0px
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<style>
body {
background-color: #efefef;
border: 0px;
margin: 0px;
}
h1, h2, h3 {
color: #333333;
margin: 0px;
font-family: Verdana, Helvetica;
}
}
h1 {font-size: 21px;}
h2 {font-size:18px;font-weight:bold;}
h3 a {color: #0269cd; text-decoration: none; text-decoration: none;font-weight:bold;}
table.module{border-spacing:0!important;background-color: #ffffff;border-collapse: collapse;}
h3 {font-size: 16px;font-weight:normal;}
html,body{min-width:600px;}
</style>
</head>
<body style="background-color: #efefef;">
<div style="padding-top:150px;padding-bottom:150px;background-color:white;">
<table width="600" height="242" align="center" border="0" cellspacing="0" cellpadding="0" class="module" >
<tr>
<td width="263" height="242" style="padding-left:30px;"><a href="http://www.cnn.com"> <img src="http://placekitten.com/263/242" width="263" height="242" alt="Module2_img"></a></td>
<td width="277" height="242" align="left" style="padding-left:18px;background-color:#efefef;">
<h2>Content</h2><br>
<h3>There should be a cute cat on the left <br><br>
<a href="http://www.ikea.no/">Click this</a></h3>
</td>
</tr>
</table>
</div>
</body>
</html>
身体{
背景色:#EFEF;
边界:0px;
边际:0px;
}
h1,h2,h3{
颜色:#333333;
边际:0px;
字体系列:Verdana,Helvetica;
}
}
h1{字体大小:21px;}
h2{字体大小:18px;字体大小:粗体;}
h3 a{颜色:#0269cd;文本装饰:无;文本装饰:无;字体大小:粗体;}
表.模块{边框间距:0!重要;背景颜色:#ffffff;边框折叠:折叠;}
h3{字体大小:16px;字体重量:正常;}
html,正文{最小宽度:600px;}
内容
左边应该有一只可爱的猫
我可以通过改变两件事来解决这个问题
要使图像粘贴到列的右侧,需要将第二个单元格的填充从18px
增加到30px
。或者,可以使每个单元格的宽度相同,然后将图像向右浮动
要去除图像下方的额外填充,您需要添加display:block编码>到受影响的图像
是一个内联元素,因此它会在其下方留下额外的填充,以便为文本等其他元素腾出空间
如果无法使用显示:块代码>无论出于何种原因,垂直对齐:底部代码>也可以工作。这将允许您保持图像内联,并将设置图像的垂直对齐方式,使其与表格单元格的底部匹配