这是我的代码:
<html>
<head>
<style>
body {
margin: auto;
width: 720px;
}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</p>
</body>
</html>
在全高清屏幕上以纵向模式运行时,一切正常:段落宽度为 720 像素。如果我将宽度更改为 1080 像素,也没有问题:没有边距 - 段落从页面的一侧到另一侧。
但如果我尝试在 720x1280 高清屏幕上以纵向模式查看此内容,系统会自动添加 130 像素的边距。
为什么会这样? margin: auto 在较小的屏幕上会搞砸吗?我如何解决它?任何帮助将不胜感激。
最佳答案
<style>
body{
margin: 0 auto;
width:720px;}
</style>
这应该有效,检查 jsfiddle .
关于html - CSS 在纵向模式下的小屏幕上添加自动边距,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45752727/