Hej
Helt ny på Bootstrap, och håller på att stega igenom en tutorial. Har installerat allt som man ska på datorn (vad jag vet), men ändå funkar bara delar utav min style. Jag har bland annat problem att skapa en ordentlig nav-bar. Den syns inte, och inte heller min infällda (hamburger-)meny. I webbläsaren ser det ut såhär och koden jag skrivit ser ut såhär
Vissa delar fungerar alltså i andra dokument jag har, men det är fortfarande delar som inte fungerar. Om jag ska vara ärlig vet jag inte vad jag gör för fel, eftersom vissa saker fungerar och vissa inte? För övrigt använder jag Atom som editor och det är Bootstrap 4.0.0 jag använder. Tutorial'en jag tittar på är dock från 2017 och använder tidigare version av Bootstrap, men ska detta verkligen spela så stor roll? Koden är väl den samma? Ganska ny i HTML, JS och CSS, men känns som det är mitt JS som inte riktigt lirar. Eller?
Min index.html ligger för övrigt i en mapp som innehåller mapparna "css" och "js" där bootstrap.min resp bootstrap.min finns så mapp-/filstrukturen ska vara ok.
Tack för hjälpen.
Helt ny på Bootstrap, och håller på att stega igenom en tutorial. Har installerat allt som man ska på datorn (vad jag vet), men ändå funkar bara delar utav min style. Jag har bland annat problem att skapa en ordentlig nav-bar. Den syns inte, och inte heller min infällda (hamburger-)meny. I webbläsaren ser det ut såhär och koden jag skrivit ser ut såhär
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Bootstrap 101 Template</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<button type="button" class="navbar-toggle"
data-toggle="collapse"
data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Prog</a>
<div class="navbar-collapse collapse">
<u1 class="nav navbar-nav navbar-right">
<l1 class="active"><a href="#"> Home </a></li>
</u1>
</div>
</div>
</nav>
skriver jag inverse istället för default är vår bar svart ist för grå
skriver jag static istället för fixed är vår bar fastbränd ist för "fast"
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
</body>
</html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Bootstrap 101 Template</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<button type="button" class="navbar-toggle"
data-toggle="collapse"
data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Prog</a>
<div class="navbar-collapse collapse">
<u1 class="nav navbar-nav navbar-right">
<l1 class="active"><a href="#"> Home </a></li>
</u1>
</div>
</div>
</nav>
skriver jag inverse istället för default är vår bar svart ist för grå
skriver jag static istället för fixed är vår bar fastbränd ist för "fast"
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
</body>
</html>
Min index.html ligger för övrigt i en mapp som innehåller mapparna "css" och "js" där bootstrap.min resp bootstrap.min finns så mapp-/filstrukturen ska vara ok.
Tack för hjälpen.
__________________
Senast redigerad av cottononly 2018-05-02 kl. 17:18.
Senast redigerad av cottononly 2018-05-02 kl. 17:18.
