好的,所以我一直试图调整我的文字,似乎没有任何事情发生。对齐此代码的最佳方法是什么,我希望它以购物袋为中心。我也使用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>
&#13;
答案 0 :(得分:2)
您可以将内容包装在div中,并使用text-align来对齐文本。
<强> 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;
}
答案 1 :(得分:1)
.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>
答案 2 :(得分:0)
您可以使用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;
}
这应该做的工作