2015-01-17 4 views
3

저는 부트 스트랩에 정말 새롭습니다. 나는 그것에 대해 다소 좌절감을 느낍니다. 반응 형 웹 사이트를 구축하려고하는데 navbar 오버플로에 로고가 필요합니다. 나는 html과 css (부트 스트랩을 사용하지 않고)에서 해냈지만 반응이 없다. 이것은 내가 부트 스트랩으로하고 싶은 일이지만 계속 비참하게 실패하고 있습니다. http://prntscr.com/5tifol 이것은 HTML/CSS 코드 :navbar (부트 스트랩 3)의 로고 오버플로

`<body> 
<div id="motodiv"> 
<div id="text1" style="display:none;">TEXTTEXTTEXTTEXTTEXT</div> 
<div id="text2" style="display:none;">TEXTTEXTTEXTTEXTT</div> 
</div> 
<div id="logo"><img id="logoimg" src="logo.png"></div>` 

http://jsfiddle.net/yn7o2neb/ 그리고 이것이 내가 부트 스트랩 http://prntscr.com/5tifrp 이 부트 스트랩 코드는했던 것입니다 :`

<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> 
    <!-- Bootstrap --> 
    <link href="css/bootstrap.min.css" rel="stylesheet"> 
    <link href="css/index.css" rel="stylesheet"> 
    </head> 
    <body> 
     <div class = "navbar navbar-inverse navbar-fixed-top"> 
      <div class="navbar-inner"> 
       <div class="container"> 
         <a class="brand" href="index.html"> <img src="images/logo.png" class="img-responsive clearfix logo"></a> 
       </div> 
      </div> 
     </div> 


     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
     <script src="js/bootstrap.min.js"></script> 
    </body>` 

http://jsfiddle.net/oc5vgha4/ 어떤 도움을 환영합니다. 또한 이미지의 크기를 조정하려고하면 navbar의 크기가 조정됩니다.

+0

여기에 코드가 없으므로 CSS 포지셔닝을 시도한 적이 있는지 알려주십시오. –

+0

CSS 위치 지정을 시도했지만 응답하지 않습니다. 코드를 추가했습니다. –

답변

1

.navbar-brand 클래스

.navbar-brand {     
    position: absolute; 
    left: 0px; 
    top: 0px; 
    width: 50px;   
    margin-left: 0px; 
    padding: 30px; 
} 

당신이 맞는 볼 당신은 패딩, 심지어 위치를 조정할 수 있습니다에이 CSS를 사용해보십시오. 내 예를 볼 수 있습니다. http://jsfiddle.net/0hmrd1b8/

도움이 되었기를 바랍니다.

+0

감사합니다. 도움이됩니다! –

+0

좋아요! 다행이 도움이 듣고 있습니다. 내 대답을 당신의 문제를 해결하는 대답으로 뽑아 내라. :) @ DimitrijeMitic –

+0

나는 시도했지만, 15 평판이 필요합니다. –