Bootstrap 修复顶部导航栏
Bootstrap fix top navbar
所以我正在努力熟悉使用 Flask bootstrap。然而,有一件事让我感到困惑。我正在使用 http://getbootstrap.com/components/#navbar-fixed-top .
它告诉我添加:body { padding-top: 70px; }
但是,它要我在哪里添加呢?我已将它手动添加到我的 html 文件中,该文件有效,但我正在使用块。
这就是现在的样子,我想这不是它应该的样子吧?
您尝试添加的地方看起来不错。它只需要位于在 bootstrap CSS 文件之后加载的任何 CSS 文件中。如果您在 HTML 中内联 CSS,就像您看起来的那样,并且您正在从 <head>
正确加载 bootstrap CSS部分,然后它将在 bootstrap 之后加载,所以没关系。唯一要记住的是,如果将 CSS 重构到单独的文件中,对页面 CSS 文件的 <rel>
调用应该在 after bootstrap CSS 调用。
Flask 调用的块似乎本质上是模板,类似于 backbone、ruby、小胡子模板等中的模板。使用这些模板时,让您的页面在本地主机中加载会很有帮助,并检查源代码,这样您就可以看到最终页面是如何加载的,以及所有内容相对于其他部分的加载位置。然而,同样的原则应该适用。对于 Flash,您应该使用 head
块加载页面的 <head>
部分。
所以我正在努力熟悉使用 Flask bootstrap。然而,有一件事让我感到困惑。我正在使用 http://getbootstrap.com/components/#navbar-fixed-top .
它告诉我添加:body { padding-top: 70px; }
但是,它要我在哪里添加呢?我已将它手动添加到我的 html 文件中,该文件有效,但我正在使用块。
这就是现在的样子,我想这不是它应该的样子吧?
您尝试添加的地方看起来不错。它只需要位于在 bootstrap CSS 文件之后加载的任何 CSS 文件中。如果您在 HTML 中内联 CSS,就像您看起来的那样,并且您正在从 <head>
正确加载 bootstrap CSS部分,然后它将在 bootstrap 之后加载,所以没关系。唯一要记住的是,如果将 CSS 重构到单独的文件中,对页面 CSS 文件的 <rel>
调用应该在 after bootstrap CSS 调用。
Flask 调用的块似乎本质上是模板,类似于 backbone、ruby、小胡子模板等中的模板。使用这些模板时,让您的页面在本地主机中加载会很有帮助,并检查源代码,这样您就可以看到最终页面是如何加载的,以及所有内容相对于其他部分的加载位置。然而,同样的原则应该适用。对于 Flash,您应该使用 head
块加载页面的 <head>
部分。