简体   繁体   中英

Bootstrap 3 Ignores custom.css on load

I have this very strange problem.

I'm trying to code with Bootstrap 3 . in the <head> I declare links for CSS to be used. Although the HTML completely ignores my third link.

<head>
    <title>Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">        
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/bootstrap-theme.css" rel="stylesheet">      
    <link href="css/custom.css" rel"stylesheet">
</head>

As you can see, the third link refering to css/custom.css is there correctly. But on the website it's being completely ignored.

I have tried coding a simple button using

<button type="button" class="btn btn-primary">Default</button>

And in custom.css I have the .btn class

.btn{
border-radius: 0px;
}

So the button's border should be straight not rounded like it is in bootstrap3. Problem is that my custom.css doesn't want to work and it's just completely ignored.

Can anyone please help me with this?

Thank you.

Patryk.

Add '=' after 'REL'.

Your code:

 <link href="css/custom.css" rel"stylesheet">

Should be:

 <link href="css/custom.css" rel="stylesheet">

If custom.css is correctly loaded than bootstrap code has a higher precedence, so you might want to use button.btn.btn-primary{border-radius: 0px;} or .btn.btn-primary{border-radius: 0px!important;}

As @Damian says it, the custom.css file is not loaded at all.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM