我有一個回傳按鈕和一個標題，我想把它們放在頂部，而且它們應該是對齊的。 我的問題是，我怎樣才能將 "Hello World "的標題放在頂部中央，而將后退按鈕放在左上方？
<HeaderTopContainer>/span>
<BackContainer>/span>
<BackArrow src=" arrow. svg" alt="back" />
<BackText> 回傳 </BackText>
</BackContainer>/span>
<Title>Hello World</Title>
</HeaderTopContainer>/span>
uj5u.com熱心網友回復：
https://codesandbox.io/s/heade-styled-components-forked-yjirb?file=/src/Header.js
<HeaderTopContainer>
<BackContainer>/span>
<BackArrow src=" arrow. svg" alt="back" />
<BackText> 回傳 </BackText>
</BackContainer>/span>
<Title>Hello World</Title>
<BackContainer></BackContainer>
</HeaderTopContainer>/span>
const BackContainer = styled.div`.
display: flex;
align-items: center;
cursor: pointer;
最小寬度:100px
`;
看看這個，我在標題后面放了一個假的后退按鈕容器，并給了和左后退按鈕容器相同的寬度
。在這之后，flex將完成作業，
。注意：正文的默認頁邊距為8px，如果不需要的話，請撤消該頁邊距
。uj5u.com熱心網友回復：
在你的標題的css中使用:
position: absolute;
top: 0;
right: 0;
left: 0;
width: 100%;
text-align: center;
而對于回傳按鈕：
position: absolute;
top: 0;
left: 0;
uj5u.com熱心網友回復：
問題是你對標題行使用了display: flex。
我已經配置了你的鏈接。試試這個
你必須為后退按鈕設定position: absolute，并將它移到左邊，并為標題文本添加display: block，并添加text-align:center就可以了。
for BackContainer
span class="hljs-selector-class">.back {
display: flex;
align-items: center;
cursor: 指標。
position: absolute;
left: 4px;
top: 20px;
}對于Title
span class="hljs-selector-class">.title {
display: block;
align-items: center;
字體大小: 18px;
}轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/333733.html
標籤：