7

我想在我正在开发的某个网站上使用 twitter 引导程序。该网站需要一个预设模板用于页面的某些部分。

如果我包含 twitter 引导样式表，它会弄乱原始模板。

我想包含外部 bootstrap.cc 样式表，但使其仅适用于 class="mycontent" 的后代标签

<html>
<link href="original stylsheet.css">
<link href="bootstrap.css">
...
...
<div class="header">
original stlesheet to be used here
</div>
<div class="mycontent">
bootstrap css to work for all descendents of my content
</div>

我知道一种方法是编辑 css 并在每个标签之前添加 .mycontent 。但我想知道是否有更聪明的解决方案

4

2 回答 2

5

作用域 CSS

如果scope存在属性，则<style>仅适用于其父元素。

<div>
  <style scoped>
  /* your css here */
  <style>
  <!-- content -->
</div>

它缺乏浏览器支持，但有一个 polyfill：jQuery Scoped CSS 插件。

补充阅读：使用 Scoped CSS 拯救一天。

当前浏览器支持：http ://caniuse.com/#feat=style-scoped

于 2012-09-23T15:30:41.973 回答
-1

如您所见，我可以看到您的代码：

<html>
<link rel="original stylsheet.css">
<link rel="bootstrap.css">
...
...
<div class="header">
original stlesheet to be used here
</div>
<div class="mycontent">
bootstrap css to work for all descendents of my content
</div>

您正在使用错误的路径。
你应该试试<link href="bootstrap.css">
我希望你的问题会得到解决

于 2012-08-24T13:55:22.297 回答