twitter-bootstrap Bootstrap Offcanvas - offcanvas css 类真的存在吗？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19627831/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap Offcanvas - do offcanvas css classes really exist?
提问by curious_george
I recently found out about twitter bootstrap and I have been diving deep into the most recent version, Bootstrap 3. On the website, there is an example for an "Off Canvas" template (here: http://getbootstrap.com/examples/offcanvas/) which I have been modifying. But there are several things in the example that do not make sense to me.
我最近发现了 twitter bootstrap 并且我一直在深入研究最新版本 Bootstrap 3。在网站上，有一个“Off Canvas”模板的例子（这里：http: //getbootstrap.com/examples/ offcanvas/) 我一直在修改。但是这个例子中有几件事对我来说没有意义。
In the "Off Canvas" template example, there are div elements that reference classes such as "row-offcanvas", "row-offcanvas-right", and "sidebar-offcanvas". I cannot find these in the bootstrap.css, and neither do I see these in the Chrome DevTools. I also do not see any effect when I remove these classes. Do these classes have any purpose? Or was it a mistake in the example to include those seemingly non-existent classes?
在“Off Canvas”模板示例中，有引用类的 div 元素，例如“row-offcanvas”、“row-offcanvas-right”和“sidebar-offcanvas”。我在 bootstrap.css 中找不到这些，在 Chrome DevTools 中也看不到这些。当我删除这些类时，我也没有看到任何影响。这些课程有什么目的吗？还是示例中包含那些看似不存在的类是错误的？
采纳答案by mgttlinger
If you look at the page source closely you will find that in the header there is
如果您仔细查看页面源代码，您会发现在页眉中有
<!-- Custom styles for this template -->
<!-- Custom styles for this template -->
<link href="offcanvas.css" rel="stylesheet">
<link href="offcanvas.css" rel="stylesheet">
These classes are defined in there. And at least for me it does make a clearly visible difference if I remove this.
这些类在那里定义。至少对我来说，如果我删除它，它确实会产生明显的差异。
回答by Thaddeus Albers
As @mgttlinger mentioned the css is defined at offcanvas.cssSee http://getbootstrap.com/examples/offcanvas/offcanvas.css
正如@mgttlinger 提到的 css 定义offcanvas.css见http://getbootstrap.com/examples/offcanvas/offcanvas.css
If want to a walk through of how it works see http://www.kendoui.com/blogs/teamblog/posts/13-11-05/creating-a-rwd-off-canvas-layout-with-bootstrap-3.aspx. It uses http://getbootstrap.com/examples/offcanvas/as the starting point and explains the css used to create off canvas.
如果想了解它的工作原理，请参阅http://www.kendoui.com/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-canvasis an excellent resource for more background on off canvas and most other responsive design patterns.
http://bradfrost.github.io/this-is-responsive/patterns.html#off-canvas是一个很好的资源，可以提供关于画布和大多数其他响应式设计模式的更多背景知识。
回答by kenn
i did experience the same dunno what i did wrong but js didnt seems to work i just remove all codes and link back all js and css not working. So i try other js on my other folders it work and copy them on my empty offcanvas page it works. Then put back all templates code and it works fine now i guess its my machine some components stop responding maybe just try restart.
我确实遇到了同样的不知道我做错了什么但 js 似乎没有工作我只是删除所有代码并链接回所有 js 和 css 不起作用。所以我在我的其他文件夹上尝试其他 js 并在我的空offcanvas页面上复制它们。然后放回所有模板代码，现在它可以正常工作了，我猜是我的机器某些组件停止响应，也许只是尝试重新启动。
