问题描述
h1 {
text-align: center;
}
<h1>Reliable,efficient delivery Powered by Technology</h1>
我想要的:-
我尝试添加宽度,但随后它会将标题向左推。我怎样才能在中心实现这个多行标题。
解决方法
实现您想要的最简单方法是添加 <br>
- The Line Break element。
或者你可以做这样的事情,如果你喜欢css方式https://codepen.io/fromaline/pen/WNpEgXR
h1 {
text-align: center;
}
<h1>Reliable,efficient delivery <br> Powered by Technology</h1>
你可以试试这样的-
#smallheader{
font-size: 50px;
margin-right: 50%;
text-align: center;
margin-left: 50%;
}
<div id="smallheader">This is my text that should be on the next line.</div>
您只需更改 margin-right: your amount;
您声称使用宽度不起作用,但它确实起作用(以及标准的居中机制):
h1 {
text-align: center;
width: 400px;
margin: 0 auto;
}
<h1>Reliable,efficient delivery Powered by Technology</h1>
不过,这不是一个好方法,因为它取决于字体和容器大小。最好明确地打破这一行:
h1 {
text-align: center;
}
<h1>Reliable,efficient delivery<br>Powered by Technology</h1>