问题
I'm injecting the Foundation CSS framework into an existing project. Many of Foundation's class names conflict with classes in the underlying code. How can I encapsulate the Foundation JavaScript and CSS files in their own namespace?
These are the specific files that cause the conflicts:
- foundation.css
- foundation.js
- foundation.reveal.js
I'm using Foundation v5.
I've added the twitter-bootstrap tag to this question because I've also tried to put the Bootstrap CSS and JavaScript files in their own namespace (e.g., with these instructions), but with no success. I suspect that the right namespacing approach would work for both Foundation and Bootstrap.
回答1:
I ended up swapping Foundation for the Ink framework, which has the features I need and also namespaces most of its classes. I realize that this doesn't directly answer the question, but it solved my problem, so I'm posting it in case others have the same issue.
回答2:
The only option i see is to edit the sass files of foundation and compile your own version.
There is a discussion on github related to this issue: https://github.com/zurb/foundation/issues/546
Maybe it's easier to prefix your own classes instead of the framework ones.
来源：https://stackoverflow.com/questions/26618627/namespacing-the-bootstrap-and-foundation-css-frameworks