5

我最近发现了 twitter bootstrap,我一直在深入研究最新版本 Bootstrap 3。在网站上,有一个“Off Canvas”模板的示例(此处: http: //getbootstrap.com/examples/我一直在修改的offcanvas/ )。但是这个例子中有几件事对我来说没有意义。

在“Off Canvas”模板示例中,存在引用“row-offcanvas”、“row-offcanvas-right”和“sidebar-offcanvas”等类的 div 元素。我在 bootstrap.css 中找不到这些,也没有在 Chrome DevTools 中看到这些。当我删除这些类时,我也看不到任何效果。这些课程有什么目的吗?还是在示例中包含那些看似不存在的类是错误的?

4

3 回答 3

6

正如@mgttlinger 提到的,css 定义在offcanvas.css参见http://getbootstrap.com/examples/offcanvas/offcanvas.css

如果想了解它的工作原理,请参阅http://www.kendoui.c​​om/blogs/teamblog/posts/13-11-05/ creating-a-rwd-off-canvas-layout-with-bootstrap-3 .aspx。它使用http://getbootstrap.com/examples/offcanvas/作为起点,并解释了用于创建画布外的 css。

http://bradfrost.github.io/this-is-responsive/patterns.html#off-canvas是一个很好的资源,可以提供关于画布和大多数其他响应式设计模式的更多背景信息。

于 2014-01-05T04:24:33.443 回答
3

如果您仔细查看页面源代码,您会发现在标题中有

<!-- Custom styles for this template -->

<link href="offcanvas.css" rel="stylesheet">

这些类是在其中定义的。至少对我来说,如果我删除它,它确实会产生明显的差异。

于 2013-10-28T05:49:31.603 回答
0

我确实遇到了同样的不知道我做错了什么但 js 似乎没有工作我只是删除所有代码并链接回所有 js 和 css 不工作。所以我在我的其他文件夹上尝试其他 js 它可以工作并将它们复制到我的空画布页面上它可以工作。然后放回所有模板代码,它现在可以正常工作了,我猜我的机器有些组件停止响应,也许只是尝试重新启动。

于 2017-03-16T10:24:30.160 回答