Question

我试图集中我的文字＆＃34;例子＆＃34;。我的span标签中有文本对齐中心，但它没有居中。我只想要＆＃34;示例＆＃34;中心，而不是其他文本。

查看我的jsfiddle：http://jsfiddle.net/huskydawgs/dx5fe6x5/

HTML

<p class="textbox">
<span style="text-align:center; color:#2251a4; font-weight:bold;letter-spacing: 10px;">EXAMPLE</span><br><br> The powers of the Company shall be exercised by or under the authority of, and the business and affairs of the Company shall be managed under the direction of, one or more managers. The Manager(s) shall be: Jane Doe, John Doe and Yogi Berra.</p>

CSS

.textbox {
padding: 8px 12px;
color: #555555;
background-color: #F1F1F1;
border: #e2e3e4 2px solid;
}

Answer 1

将display:block;添加到跨距样式：

＆＃13;

.textbox {
    padding: 8px 12px;
color: #555555;
background-color: #F1F1F1;
border: #e2e3e4 2px solid;
}
.title{
    text-align:center;
    color:#2251a4; 
    font-weight:bold;
    letter-spacing: 10px;
    display:block;
        
}

＆＃13;

<p class="textbox">
    <span class="title">EXAMPLE</span>
  he powers of the Company shall be exercised by or under the authority of, and the business and affairs of the Company shall be managed under the direction of, one or more managers. The Manager(s) shall be: Jane Doe, John Doe and Yogi Berra.
</p>

＆＃13;

＆＃13;
我强烈建议你不要使用内联样式，只使用<br>用于它们的位置，不用于结构！
JSFiddle Demo

Answer 2

span标记是一个内联标记 - 这意味着你无法居中。

但是，如果您将其显示更改为“阻止”，则可以将左右边距调整为自动，您可以 - 像这样：

.textbox>span{
display:block;
margin-right:auto;
margin-left:auto;

}

使用“＆gt;”只会在.textbox类之后直接定位“spans”。

示例：http://jsfiddle.net/dx5fe6x5/5/

如何以我的风格为中心文字？

2 个答案: