Why is the Bootstrap code not working?

A

Alexander Volkov2017-08-12 10:29:06

css

Alexander Volkov, 2017-08-12 10:29:06

I am learning the framework from a lesson from Dudar, I should get a header when using the navbar navbar-default classes, but no styles for these classes are automatically selected

<!DOCTYPE html>
<html>
<head>
  <title>My website</title>
  <link rel="stylesheet" href="css/style.css">
  <link rel="stylesheet" href="css/bootstrap.min.css">
  <link rel="stylesheet" href="js/bootstrap.js">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</head>
<body>
    <div class="navbar navbar-default">
      <div class="container-fluid">
        <div class="navbar-header">
          My website
          
        </div>
        
      </div>
      
    </div>
        
      
  
</body>
</html>

Reply

Answer the question

In order to leave comments, you need to log in

5 answer(s)

A

Alexey Golyagin, 2017-08-17
@webrevenue

Throw out the lessons from Dudar, read about semantic markup (header, nav, article, etc.) and how to place styles correctly: first, the main bootstrap.min.css is located, and under it is your own style, in which you essentially edit the main styles)

A

Arman, 2017-08-12
@Arik

Right click -> View source code. Then compare his version with yours.

S

sergey, 2017-08-12
@zorro76

Compare your code and this one for example : jsfiddle

V

Vladimir, 2017-08-12
@djQuery

There is:

<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="js/bootstrap.js">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js">

Should be:

<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js">
<link rel="stylesheet" href="js/bootstrap.js">

In general, it is better to place js code before</body>

Z

zzippo, 2021-11-14
@zzippo

Try to remove rel="stylesheet" from lines with links to javascript code.