我显示了很多图片。调整窗口大小时,我希望能够将适合窗口的图像数量居中。目前,当浏览器窗口调整大小时,它会向左对齐。
li {
float:left;
display: inline-block;
margin: 10px;
width: 250px;
max-width: 100%;
text-align:center;
}
.itemS{
max-width:1366px;
text-align:center;
margin: 0 auto;
}
.itemS.itemType{
width: 250px;
padding:10px;
background-color:#333;
position:absolute;
top:0px;
text-align:center;
}
最佳答案
我相信您想要的是 CSS 媒体查询。您在查询中设置断点,当浏览器窗口大于或小于断点时,将应用您的新样式。
如果这是你的初始风格:
li {
float:left;
display: inline-block;
}
当浏览器窗口低于 768 时,您可能想更改 div,您可以这样更改样式:
@media all and (max-width: 768px) {
li {
float: none;
margin: 0 auto;
}
}
阅读更多信息 CSS-Tricks或在 this answer .
希望这可以帮助您上路!祝你好运!
关于html - 调整窗口大小时居中图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23549733/