如何在引導程序3導航欄中放置圖像而不是品牌文本？

我正在用bootstrap3構建我的第一個響應式web，除了我不能將導航放在我想要的位置外，一切都很好。當屏幕調整大小時，移動屏幕變得更糟。在導航欄的文本，而不是使用圖像我找不到任何指示..如何在引導程序3導航欄中放置圖像而不是品牌文本？

2014-01-08 bonsai

您不會將東西添加到圖像的底部。圖像是圖像，您可以在導航欄中放置圖像。 http://stackoverflow.com/a/20859774/1004312。瞭解有關CSS，html和響應式設計的更多信息： http://www.smashingmagazine.com/2009/05/29/useful-glossaries-for-web-designers-and-developers/ http：// www。 cssbasics.com/ http://www.htmldog.com/guides/css/beginner/ http://blog.teamtreehouse.com/beginners-guide-to-responsive-web-design http：// www。 splio.com/responsive/ http://www.html5rocks.com/en/mobile/responsivedesign/ http://getbootstrap.com/ - 閱讀文檔！ – Christina

http://getbootstrap.com/getting-started/#examples查看定位選項示例中的代碼。查看上面的註釋，瞭解如何在導航欄中放置圖像。 – Christina

我編輯了你的問題。您需要發佈jSFiddle，bootply，CodePen或JSBin與您的css和html以及任何jQuery（如果適用）。 – Christina

<img id="my-img" src=""> 
    <nav></nav> 
</img> 

<style> 
    #my-img{ 
     position: relative; 
    } 
    #my-img nav{ 
     position:absolute; 
     bottom:0; 
    } 
</style>

你要像相對定位和IMG內的導航欄絕對定位。

來源

2014-01-08 23:54:07 jkieley

在導航欄標題中，使用類.navbar-brand類的鏈接並在其中插入圖像。同樣，如下面的例子所示，聲明你的圖像是響應式的。

<nav class="navbar navbar-default" style="border:0px;margin:0px;"> 
    <div class="container-fluid" style="background-color:#175FAF;"> 

     <div class="navbar-header"> 
      <a class="navbar-brand" href="#"><img src="img/logo.jpg" alt="logo" class="img-responsive"></a> 
     </div> 


    </div> 
</nav>

來源

2015-08-22 21:39:13

如何在引導程序3導航欄中放置圖像而不是品牌文本？

回答

相關問題