尽管看似准确的执行,bootstrap,django,css属性不会改变

时间:2016-12-04 19:30:00

标签: css twitter-bootstrap google-font-api css-specificity

我正在尝试设置导航栏的样式以删除bootstrap css默认的小边框半径。

我正在尝试实施我选择的谷歌字体。尽管我看似完美的执行,但没有任何工作。

我正在使用django,尽管对此并不重要,但它只是解释了一些语法。

我的HTML文件中的链接按以下顺序排列:

<!-- Loads the path to the static files-->
{%  load staticfiles %}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link href="https://googleapis.com/css?family=Satisfy" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="{% static 'music/style.css' %}">
<script src ="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

我想要操作的HTML属性如下,请注意类

<nav class="navbar navbar-inverse">
<div class="container-fluid">
    <!--Header-->
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#mainNavBar">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class = "navbar-brand" href="{% url 'music:index' %}">Viberr</a>
    </div>

顶部的div与导航栏的类是具有我想要更改的border属性。

带有navbar-brand类的div是我想要应用我的谷歌字体的那个。

这是我链接的css文件:

 body{
    background: white url("images/background1.jpg");
}
.navbar{
    border-radius: 0;
}

.navbar-brand{
    font-family: 'Satisfy', cursive;
}

正如你所看到的,除非我完全遗漏某些东西,否则没有理由不这样做。

0 个答案:

没有答案