如何防止導航欄重疊其他元素

我正在建設一個網站，我有一個問題，導航欄隱藏頁面的第一位，所以我看不到信息。我將如何解決這個問題？鏈接到我的網站在這裏： codepen.io/sookyungahn/pen/wzQkBp?editors=1100如何防止導航欄重疊其他元素

來源

2016-10-26 Soo Kyung Ahn

你的代碼是哪裏？ –

@GeoffJames好日子，我沒有粘貼代碼，因爲它是在IDE中構建的，如果我是對的。我不想粘貼整個代碼，但是對我來說這樣做更好嗎？在這種情況下，我需要包含額外的位來做到這一點。 –

你最初說「*這是我的代碼：*」......這就是爲什麼我問。曾聽說過「RTFM」？我建議你在開始使用它之前閱讀一些文檔，然後來到SO上來問一個已經很常見的問題......無論如何：你可以將你身體的「padding-top」設置爲與你的導航欄的「padding-top」一樣高度是推動內容下降適量（見@ Ranveer的回答下面） –

在你的情況下，使用您的導航欄上的相同尺寸的高度home DIV ID添加padding-top。

<div class="container-fluid well" id="home" style="display:block; padding-top:50px;">

來源

2016-10-26 09:44:25

美好的一天，謝謝！你的答案奏效。它是否正確，因爲導航欄高度是50px？另外，爲什麼以前的答案不適用於我的情況？ –

是的！如果您的導航欄chage高度，只需更改您的主div的padding-top。 –

謝謝！我還想問，只是爲了將來的使用，如果我想使填充（甚至是邊距）增加或減少部分div，我該怎麼辦？例如，我創建了一個大小爲1000 * 500的div。然後我在它的中心添加一個元素，並希望它向下移動而不添加到div。如果我再次使用padding-top，是否會添加到div大小？我記得有一個特定的代碼，但我不記得我在哪裏看到它。 –

添加您的導航欄的高度大小的填充到身體。

在官方自舉示例here中，他們在頂部添加70px填充。基本上，

body { 
    padding-top: 70px; 
}

來源

2016-10-26 09:34:32 Ranveer

<img style="margin-right:10px;margin-top:50px" class="image gap img-rounded pull-left" src="http://odezhda-stilnaya.ru/kartinki/1/ptichka_babochki_zvezdy_2560x1600.jpg" alt="PLACEHOLDER IMAGE" /> 
    <div> 
     <h3 style="font-family:HelveticaNeue, Tahoma; font-weight:200;margin-top:50px;">I am a website developer, passionate about programming and assisting people. I am currently an intern at a tech startup. 
     </h3>

偉大的代碼:)

只需添加的margin-top：如圖50像素。

快樂編碼:)

來源

2016-10-26 10:23:14

如何防止導航欄重疊其他元素

回答

相關問題