부트 스트랩이 html로 작동하지 않습니다

"pull-left"클래스가 작동하지 않습니다. 로고가 왼쪽으로 떠 다니지 않고 body 태그의 배경색도 보이지 않습니까? 누군가 내가 잘못 가고 있다고 설명 할 수 있습니까? index.html 파일과 부트 스트랩 파일은 같은 디렉토리에 있습니다. 태그도 확인했지만 오타를 찾을 수 없습니다. 부트 스트랩 4 당김 오른쪽 당겨 왼쪽에서부트 스트랩이 html로 작동하지 않습니다

body { 
 
    font-size: 16px; 
 
    font-family: font-family: 'Oxygen', sans-serif; 
 
    background-color: #61122f; 
 
    color: #fff; 
 
} 
 

 
#header-nav { 
 
    background-color: #f6b319; 
 
    border-radius: 0; 
 
    border: 0; 
 
} 
 

 
#logo-img { 
 
    background: url('https://scontent-sea1-1.cdninstagram.com/t51.2885-19/s150x150/17437826_285820131856427_2792512281873743872_a.jpg') no-repeat; 
 
    width: 150px; 
 
    height: 150px; 
 
    margin: 10px 15px 10px 0; 
 
} 
 

 
.navbar-brand { 
 
    padding: 25px; 
 
} 
 

 
.navbar-brand h1 { 
 
    font-family: 'Lora', serif; 
 
    color: #557c3e; 
 
    font-size: 1.5em; 
 
    text-transform: uppercase; 
 
    font-weight: bold; 
 
    text-shadow: 1px 1px 1px #222; 
 
    margin-top: 0; 
 
    margin-bottom: 0; 
 
    line-height: 0.75; 
 
} 
 

 
.navbar-brand a:hover, 
 
.navbar-brand a:focus { 
 
    text-decoration: none; 
 
} 
 

 
.navbar-brand p { 
 
    color: #000; 
 
    text-transform: uppercase; 
 
    font-size: .7em; 
 
    margin-top: 15px; 
 
} 
 

 
.navbar-brand p span { 
 
    vertical-align: middle; 
 
}

<!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"> 
 
    <title>David Chu's China Bistro</title> 
 

 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous"> 
 

 
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> 
 

 
    <link rel="stylesheet" href="css/styles.css"> 
 
    <link href="https://fonts.googleapis.com/css?family=Oxygen:300,400,700" rel="stylesheet" type="text.css"> 
 
    <link href="https://fonts.googleapis.com/css?family=Lora:400,700" rel="stylesheet" type="text/css"> 
 

 
</head> 
 

 
<body> 
 
    <p></p> 
 
    <header> 
 
    <nav id="header-nav" class="navbar navbar-default"> 
 
     <div class="container"> 
 
     <div class="navbar-header"> 
 
      <a href="index.html" class="pull-left"> 
 
      <div id="logo-img" alt="Logo image"></div> 
 
      </a> 
 
      <div class="navbar-brand"> 
 
      <a href="index.html"> 
 
       <h1>David Chu's China Bistro</h1> 
 
      </a> 
 
      <p> 
 
       <img src="https://www.davidchuschinabistro.com/images/star-k-logo.png" alt="Kosher Certification"> 
 
       <span>Kosher Certified</span> 
 
      </p> 
 
      </div> 
 

 
     </div> 
 
     </div> 
 
    </nav> 
 
    </header> 
 
    <h1></h1> 
 

 

 
    <!-- jQuery (bootstrap JS plugins depend on it) --> 
 
    <script src="js/jquery-3.2.1.min.js"></script> 
 
    <script src="js/bootstrap.min.js"></script> 
 
    <script src="js/script.js"></script> 
 
</body> 
 

 
</html>

출처

2017-12-13 Krishna

당겨-SM-오른쪽에 당겨 SM/XS/MD/LG-남겨진

변경/없음/우

배경 색상이 적용되어 있어야합니다

몸 .... 그것은 수 .. 단지 몸의 상당히 큰 높이를 지정하여 확인 할 수 있기 때문에 높이의 단지 보이지 않는

출처

2017-12-13 06:13:08

부트 스트랩 4 pull-right, pull-left은 float-right, float-left으로 변경됩니다.

또한 부트 스트랩 CSS 파일이 배경색을 볼 수없는 다른 reboot.scss 파일과 충돌합니다.

당신은 다음과 같은 CSS 속성을 사용할 수 있습니다

갈등 해결 : 나는거야 희망

body { 
    font-size: 16px !importnat; 
    font-family: 'Oxygen', sans-serif !importnat; 
    background-color: #61122f !importnat; 
    color: #fff !importnat; 
}

내가 float-left

<a href="index.html" class="float-left"> 
    <div id="logo-img" alt="Logo image"></div> 
</a>

와 pull-left 클래스를 변경 html 태그가있어 당신에게

출처

2017-12-13 08:28:09

을하는 데 도움이 그것이 당신을 도왔다 니 기쁩니다! 그리고 대답 pls을 확인 잊지 마세요. :) 행운을 빕니다! –

부트 스트랩이 html로 작동하지 않습니다

답변

관련 문제