文本對齊HTML和CSS

好吧，我一直在嘗試對齊我的文本，似乎沒有任何事情發生。對齊此代碼的最佳方法是什麼？我希望它以購物袋爲中心。我也使用CSS風格。文本對齊HTML和CSS

<div class="total"> 
 
    <span class="simpleCart_total">$0.00</span> 
 
</div> 
 
<h3> 
 
    <center> 
 
    <img src="shopping%20bag.png" alt="shopping bag" width="25" height="25"> 
 
    </center> 
 
</h3> 
 
<script src="Java.js"></script> 
 
<p><a href="Java.js" class="simpleCart_empty"> Empty Cart</a></p>

來源

2017-10-11 Codingjr

我們可以看到更多的代碼？ – hologram

'Java'！=='JavaScript'。 –

我也很好奇。至於2017年，'

'標籤不被支持/不推薦使用，而且貌似html的align =「」'屬性的用法也是。同時，CSS'text-align：center'不是一個直接的解決方法，因爲結果可能會不同（因爲它會對齊「文本」）。 –

.total,h3,p{ 
 
text-align: center; 
 
}

<div class="total"> 
 
    <span class="simpleCart_total">$0.00</span> 
 
</div> 
 
<h3> 
 
    <center> 
 
    <img src="shopping%20bag.png" alt="shopping bag" width="25" height="25"> 
 
    </center> 
 
</h3> 
 
<script src="Java.js"></script> 
 
<p><a href="Java.js" class="simpleCart_empty"> Empty Cart</a></p>

來源

2017-10-11 01:45:17

你可以包裝在一個div的內容和使用文本對齊對齊文本。

HTML

<div class="textCenter"> 
    <div class="total"> 
     <span class="simpleCart_total">$0.00</span> 
    </div> 
    <h3><center><img src="shopping%20bag.png" alt = "shopping bag" width="25" height="25"></center></h3> 
    <script src="Java.js"></script> 
    <p><a href="Java.js" class="simpleCart_empty"> Empty Cart</a></p> 
</div>

CSS

.textCenter { 
    text-align: center; 
}

來源

2017-10-11 01:41:49 DollarChills

你可以使用Flex佈局這一點。

試試這個：

<div class="flex_container"> 
    <div class="total"> 
     <span class="simpleCart_total">$0.00</span> 
    </div> 
    <h3><center><img src="shopping%20bag.png" alt = "shopping bag" 
     width="25" height="25"></center></h3> 
    <script src="Java.js"></script> 
    <p><a href="Java.js" class="simpleCart_empty"> Empty Cart</a></p> 
</div>

CSS：

.flex_container { 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
}

這應該做的工作

來源

2017-10-11 03:24:40

文本對齊HTML和CSS

回答

相關問題