我对 Web 开发非常陌生，我遇到了 CSS 网格的问题，希望社区可以帮助解决它。我已经使用 CSS 网格创建了一个布局，现在我无法消除网格所有边上不必要的间隙：页眉、页脚、左侧和右侧。请看截图：[ https://prnt.sc/rgcas4][1]CSS 样式.grid-container{ display: grid; grid-template-columns: 11% 55% 23% 11%; grid-template-rows: auto auto auto;}.header-container{ background-image: linear-gradient(to bottom, #008686, #024848); grid-column: 1 / span 4; grid-row: 1; height: 60px; border: 1px solid black;}.left-spacing{ background-color: grey; grid-column: 1; grid-row: 2; margin-top: 15px; z-index: -1; height: 800px; border: 1px solid black;}.central-container{ grid-column: 2; grid-row: 2; margin-top: 15px; background-color: seashell; height: 800px; border: 1px solid black;}.right-menu-container{ grid-column: 3; grid-row: 2; margin-left: 15px; margin-top: 15px; background-color: steelblue; height: 800px; border: 1px solid black;}.right-spacing{ background-color: grey; grid-column: 4; grid-row: 2; margin-top: 15px; z-index: -1; height: 800px; border: 1px solid black;}.footer-container{ background-color: lightcyan; grid-column: 1 / span 4; grid-row: 3; margin-top: 15px; height: 300px; border: 1px solid black;}超文本标记语言<body> <div class="grid-container"> <div class="header-container">Header</div> <div class="left-spacing">Left Spacing</div> <div class="central-container">Center</div> <div class="right-menu-container">Right Menu</div> <div class="right-spacing">Right Spacing</div> <div class="footer-container">Footer</div> </div></body>我尝试了多种方法来消除间隙，例如：边距：0px 顶部：0px；等等，没有任何帮助提前感谢你的帮助。
1 回答
宝慕林4294392
TA贡献2021条经验 获得超8个赞
以下是您需要添加到 CSS 中的内容：
body {
margin: 0;
}或者您可以使用 CSS 顶部的 CSS * 选择器来重置所有默认边距和填充：
* {
margin: 0;
padding: 0;
}- 1 回答
- 0 关注
- 63 浏览
添加回答
举报
0/150
提交
取消