我认为我的问题对于这张图片来说是可以理解的:(好像我现在不能发布图片......这是链接) http://i.imgur.com/xpCaj0U.png
我希望每个角落都有照片,只有2个像素的边框占据整个屏幕。 对我来说似乎是一个愚蠢的问题,但由于我是初学者,所以没有找到解决方案。无论如何,我想知道这样做的最好方法,考虑到我可能会把gif的动画放在悬停上。
提前感谢您的帮助:)
答案 0 :(得分:1)
以下是您要求的示例。扩展代码段以获得最佳体验。
html,body {
width: 100%;
height: 100%;
padding: 0;
margin: 0;
}
img {
width: 50%;
height: 50%;
width: 50%;
height: 50%;
background-position: 50% 50%;
background-size: cover;
border: 2px solid black;
box-sizing: border-box;
position: absolute;
}
#topLeft {
background-image: url("https://images.pexels.com/photos/58997/pexels-photo-58997.jpeg?h=350&auto=compress&cs=tinysrgb");
left: 0;
top: 0;
}
#topRight {
background-image: url("https://images.pexels.com/photos/37029/pexels-photo.jpg?h=350&auto=compress&cs=tinysrgb");
right: 0;
top: 0;
}
#botLeft {
background-image: url("https://images.pexels.com/photos/89775/dog-hovawart-black-pet-89775.jpeg?h=350&auto=compress&cs=tinysrgb");
left: 0;
bottom: 0;
}
#botRight {
background-image: url("https://images.pexels.com/photos/33053/dog-young-dog-small-dog-maltese.jpg?h=350&auto=compress&cs=tinysrgb");
right: 0;
bottom: 0;
}

<img id="topLeft">
<img id="topRight">
<img id="botLeft">
<img id="botRight">
&#13;
答案 1 :(得分:0)
答案 2 :(得分:0)
为每张图片指定width:50; height50; float:left;
的css样式。这对我有用
答案 3 :(得分:0)
以下是响应式网页设计:
bpm_package.children[0].copy(bpm_package.children[0].parent);