我很抱歉這個問題，但我是 React JS 的新手。我已經被這個問題困了幾個小時了。
這是我的Header.js
<div className="navbar-inner">
<h2>Text1</h2>
<h3>Text2</h3>
</div>
這是我的 Header.css 檔案：
.navbar-inner {
margin: 0 auto;
color: #fff;
display: flex;
width: 87vw;
background-color: red;
justify-content: space-between;
vertical-align: sub;
}
這是顯示的內容：
我希望 Text1 和 Text2 在同一 y 線上對齊：
uj5u.com熱心網友回復：
您可以在 h2 和 h3 標簽上提供 flex。
h2, h3 {
display: flex;
align-items: center;
}
uj5u.com熱心網友回復：
align-items是使用彈性框時垂直對齊文本所需要的。
我還從 h2 和 h3 元素中洗掉了邊距（默認情況下它在那里）。
.navbar-inner {
margin: 0 auto;
color: #fff;
display: flex;
width: 87vw;
background-color: red;
justify-content: space-between;
/* New styles */
align-items: flex-end;
padding: 5px;
}
h2, h3 {
margin: 0;
}
您可能需要根據文本與邊緣的接近程度來調整填充以按照您實際想要的方式對齊它。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/463776.html
標籤：javascript html css 反应