正下方使兩個頭彼此

-1

我想在寫兩個頭正上方彼此沒有空間之間，像這樣：正下方使兩個頭彼此

頭1
HEADER2

HEADER2頂部應幾乎是感人header1的底部。

我使用引導程序，兩個頭文件之間有很大差距。我試着重寫這個類來刪除頂部和底部的邊距，但差距仍然存在。

我該怎麼做？

<div class="row even"> 
    <div class="col-md-12"> 
     <h1 id="row-bottom-margin" class="text-center"> A Title </h1> 
      <div class="col-md-12"> 
       <h3 id="row-top-margin" class="text-center"> Title 2 </h3> 
      </div> 
    </div> 
</div>

CSS：

#row-top-margin{ 
margin-top: 0px; 
} 

#row-bottom-margin{ 
margin-bottom: 0px; 
}

來源

2016-09-30 LikeToLearnStuff

CSS哪裏是HTML？ – Justinas

你用什麼CSS覆蓋類？ CSS需要比CSS引導程序用來覆蓋它更高的特異性。查看chrome開發工具以查看CSS正在做什麼 – AntlerFox

提供您的代碼！ –

您需要重置頭的邊緣和施加負緣至h2：

h1, h2 { 
    margin: 0; 
} 

h2 { 
    margin-top: -0.5em; 
}

請確保您的CSS是引導CSS後應用，以便樣式被覆蓋。

例如：http://www.bootply.com/0Njb4PrXSi

編輯：更新例如，對於你的代碼（http://www.bootply.com/3HG9MmaROJ）

重新排列HTML這樣的：

<div class="row even"> 
    <div class="no-margin col-md-12"> 
     <h1 class="text-center">A Title</h1> 
     <h3 class="text-center">Title 2</h3> 
    </div> 
</div>

，並使用no-margin類更改的邊距：

.no-margin h1, .no-margin h3 { 
    margin 0; 
} 

.no-margin h3 { 
    margin: -0.75em; 
}

來源

2016-09-30 09:59:47

嘗試給予-ve餘量。

<!DOCTYPE html> 
<html> 
<head> 
<style> 
#row-top-margin{ 
margin-top: 0px; 
} 

#row-bottom-margin{ 
margin-bottom: -10px; 
} 
</style> 
</head> 
<body> 

<div class="row even"> 
    <div class="col-md-12"> 
     <h1 id="row-bottom-margin" class="text-center"> A Title </h1> 
      <div class="col-md-12"> 
       <h3 id="row-top-margin" class="text-center"> Title 2 </h3> 
      </div> 
    </div> 
</div> 

</body> 
</html>

來源

2016-09-30 11:22:55

正下方使兩個頭彼此

回答

相關問題