我正在尝试为我3岁的患有白血病的儿子整理一份联系表.我想用它,所以人们可以给他发送鼓励的记录,我们可以将它们打印出来并挂在他的房间里.我已经使用DOMpdf创建了表单并发布了数据.我的问题是,我试图用作"静止"的背景图像,拒绝扩展到100%,无论我在图形软件中使用的是什么尺寸,它都无法正常工作.对于我所缺少的任何帮助表示赞赏.代码如下.例如,请参阅:http://bebrave.me/#contact
<head>
<style>
body { background-image: url(http://www.bebrave.me/test.jpg); background-position: top left; background-repeat: no-repeat;
background-size: 100%;
margin-top:300px;
width:612px;
height:792px;
}
</style>
</head>
<body>
<table width="500px" border="0" align="center" cellpadding="0" cellspacing="0" id="Table">
<tr>
<td align="left">Dear Joshua,<br />
<?php echo $post->Message; ?></td>
</tr>
<tr>
<td align="right">Be Brave!<br />
-<?php echo $post->Name; ?></td></tr>
</table>
</body>
一些注意事项,如果您使用的是dompdf 0.6.0 beta 3或github的最新版本,则适用:
在背景图像的应用方面,dompdf似乎与现代浏览器不同.这可能是开发团队将来想要看到的东西.但是,由于你的目标是dompdf,你必须考虑它的怪癖.
这是一个重写的文档,似乎可以满足您的需求.它的目标是github上提供的最新代码,我建议您考虑其中包含的许多改进.如果您需要定位其他版本,请告诉我,我可以调整HTML.
<html>
<head>
<link href='http://fonts.googleapis.com/css?family=Denk+One' rel='stylesheet' type='text/css'>
<style>
@page { margin: 0in; }
body {
font-family: Denk One, sans-serif;
background-image: url(http://www.bebrave.me/test.jpg);
background-position: top left;
background-repeat: no-repeat;
background-size: 100%;
padding: 300px 100px 10px 100px;
width:100%;
height:100%;
}
p {
width: 400px;
margin: auto;
}
.signature {
margin-top: 4em;
text-align: right;
}
</style>
</head>
<body>
<p>
Dear Joshua,<br />
You may not understand all that's happening. Sometimes, you may not even care.
Maybe you just want to do what you have to do to get better so you can
go back to being a three-year-old ... growing, learning, playing, loving.
It may be hard to understand, but you are a hero to your family and friends. You
are a hero to them because you show strength in the face of something so
scary. Stay strong, be happy, and and get better.
</p>
<p class="signature">
Be Brave!<br />
-BrianS
</p>
</body>
</html>
| 归档时间： |
|
| 查看次数： |
10214 次 |
| 最近记录： |