Question

我已经在此页面下载了bootsrap主题： - https://startbootstrap.com/template-overviews/scrolling-nav/

我不知道如何更改CSS文件以减少<section id="about">元素（文件index.html）的填充（或余量）。

有人能说明我要去哪里吗？

非常感谢！

Answer 1

我假设您至少知道如何使用外部css文件。

创建一个文件，让我们说home.css。然后在文件中添加以下内容。

section {
    padding : 0px;
}

我正在调整0px，根据您的要求进行调整。

然后在index.html文件

中的bootstrap文件包含标记旁边添加css文件

<link href="/path/to/bootstrap">
<link href="/path/to/home.css">

这应该可行我猜...

请记住将其放在要覆盖的文件下方。

额外注意事项：如果你想使用！important。阅读这篇文章。 https://css-tricks.com/when-using-important-is-the-right-choice/

Answer 2

除了Tomonso关于包含外部css文件的解释之外，我还建议在你的部分放置你自己的自定义类并在该类上设置css。你可以用你的“约”id做同样的事情，但是你可能会想要用相同的间距格式化一堆部分。这两个都比bootstrap的样式更具体，并且具有优先权。如果您只是覆盖section样式，则文件顺序很重要。 See here for css precedence details.

至于是否需要填充或边距，请问自己是否需要边框内的间距。如果没有边框，是否希望间距与截面颜色相同或只是透明。如果您的section和contains元素颜色相同，那么使用哪一个并不重要。 Reference

减少Bootstrap节元素（CSS）中的填充

2 个答案: