我似乎无法弄清楚页面顶部 1 或 2 像素的填充来自何处。我已经在 Chrome 和 Safari 中运行了它,但 JSFiddle 似乎没有生成它。
可能只是浏览器将其打印到页面的方式吗?如果是这样,有没有办法对抗 CSS 或 JS 中的效果?
这是 JS Fiddle 示例:
这是对您来说更容易的代码
<html>
<head>
<style>
* {padding:0; margin:0;}
h1{font-family: Arial, Helvetica, sans-serif; font-size:36px;}
h2{font-family: Arial, Helvetica, sans-serif; font-size:28px;}
h3{font-family: Arial, Helvetica, sans-serif; font-size:20px; font-weight:normal;}
h4{font-family: Arial, Helvetica, sans-serif; font-size:12px; font-weight:normal; line-height:16px;}
h5{font-family: Arial, Helvetica, sans-serif; font-size:9px;}
span{margin:0 auto;}
#wrapper{
width:800px;
height:auto;
margin:0 auto;
}
#wrapper .header{
background-image: url('http://i.imgur.com/dY8Tuu5.png');
background-repeat: no-repeat;
}
#wrapper .header span h1{
position:relative;
top:65px;
left:35px;
}
#wrapper .header span h2{
position:relative;
color:white;
text-shadow:1px 1px 1px #333;
top:115px;
left:25px;
}
</style>
</head>
<body>
<table id="wrapper">
<tr>
<td class="header" height="450" >
<span>
<h1>Big Flashy <br /> Headlines Here</h1>
</span>
<span>
<h2>Sub-Headers and such <br /> can go Here</h2>
</span>
</td>
</tr>
</table>
</body>
</html>
我必须使用表格而不是 DIV,因为它将通过电子邮件发送。
谢谢