html / CSS在div中对齐图像，主图像为背景
html / CSS在div中对齐图像，主图像为背景
提问于 2022-04-18 22:40:17
我遇到的问题与我到目前为止发现的问题有点不同--目标是创建一个HTML页面，其中每个背景img将是一个页面，因此当打印时它将是干净的。下面是代码的样子。
.thirdBackgroundPage {
background-image: url("images/firstBackgroundPage.jpeg");
height: 100%;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.icobp {
height: 75%;
width: auto;
display: block;
margin-left: auto;
margin-right: auto;
bottom: 0;
}<div class="thirdBackgroundPage">
<img class="icobp" src="images/imageCenterOfBackgroundPage.jpeg" />
</div>
这就是说，还有其他的<，div类，所以第一个图像在第三页上--例如，现在，它把图像放在中间的顶部，但是，我需要它死中心或底部。
我测试过一些东西，但都没有用。尝试在表中设置它，但这也不起作用。欢迎任何帮助。
回答 1
Stack Overflow用户
发布于 2022-04-18 23:18:05
要操作打印，您必须使用@media print，这样您就可以控制只想打印哪一个。如果您需要对一个特殊元素进行居中，您必须使用这个代码@media作为well.And显示:对于另一个您不想被打印的元素，没有。有时，您必须使用display:块o显示:内联块才能让它工作。希望这会对你的问题有所帮助。
@page {
size: A4;
margin: 0;
}
@media print {
html, body {
width: 210mm;
height: 297mm;
}
.thirdBackgroundPage{
vertical-align:middle;
align-items:center;
page-break-before:avoid;
page-break-after:avoid;
page-break-inside:avoid;}
}<div class="thirdBackgroundPage">
<img class="icobp" src="images/imageCenterOfBackgroundPage.jpeg"/>
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71917775
复制相关文章
相似问题
腾讯云开发者
