jquery - Css 未导入到 html 中

标签 jquery html css twitter-bootstrap

我的文件夹结构是这样的

索引.html css/样式.css

HTML代码:

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Case</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="css/styles.css" />
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<body>

<div class="panel panel-default">
  <div class="panel-heading">Panel heading without title</div>
  <div class="panel-body">
    Panel content
  </div>
</div>

<div class="panel panel-default">
  <div class="panel-heading panel-heading-custom">
    <h3 class="panel-title">Panel title</h3>
  </div>
  <div class="panel-body">
    Panel content
  </div>
</div>

</body>
</html>

css/样式.css

@import url('//maxcdn.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css');

.panel-default > .panel-heading-custom {
    background: #ffaa00; color: #aaa;
}

但是,面板颜色似乎根本没有改变。显然它适用于这个 jsfiddle,我复制并粘贴了代码。

http://jsfiddle.net/a0y0qmns/

最佳答案

只需在此序列中包含文件。

 <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
 <link rel="stylesheet" href="css/styles.css" />

styles.cssbootstrap.min.css 之后,因为 bootstrap css 覆盖了样式 css。

关于jquery - Css 未导入到 html 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34555503/

相关文章:

css - 导航栏中的滑动突出显示

javascript - 数据表:是否可以根据下拉列表中的选择动态更改要查看的数据表的列?

jquery - Bootstrap 标签输入 - 如何预填充对象值

jquery - CSS:从右向左扩展 <div> 以显示文本

ios - 当应用程序更新时,嵌入 UIWebView 中的远程站点的 HTML 数据库是否会被清除?

css - 在 RhoMobile Studio 中包含 LESS/SASS 框架

javascript - Jquery 按键忽略

javascript - jQuery document.ready() 不触发动态加载的内容

html - SVG 仍然收到点击,即使指针事件 : visible/painted

javascript - Iscroll for bootstrap modal 在窗口调整大小后工作