Css 如何将具有有限宽度和绝对位置背景色的文本居中

也许我想做的太多了，但我想做的是把帖子标题放在我页面上的特色图片上方。我通过占有文本来实现它，但这当然会阻止我的页面成为响应页面。

---

我要寻找的是，有一个特定宽度的背景颜色（所以不是从左到右蔓延）的文本自动居中，并在绝对位置。 这可能吗

这就是我到目前为止所拥有的：

<style>
.post_title 
{
font-family: sans-serif; 
font-size: 14px; 
color: #fff; 
text-align:center;
position: absolute;
background-color: #0E0EFF; 
display:table; 
margin:auto; 
width: 40%; 
padding: 3px; 
border-radius: 2px;
} 
</style>

·邮衔
{
字体系列：无衬线；
字体大小：14px；
颜色：#fff；
文本对齐：居中；
位置：绝对位置；
背景色：#0E0EFF；
显示：表格；
保证金：自动；
宽度：40%；
填充：3倍；
边界半径：2px；
} 

任何帮助都将不胜感激，我已经寻找答案几个小时了

---

谢谢

我不确定我是否理解你的问题，但是你可以试着在.post\u标题周围加一个包装，比如说

div class=“titlewrapper”

应用如下样式：

div.titlewrapper {
    width:100%;
    text-align:center;
}

div.titlewrapper .post_title {
    font-family: sans-serif; 
    font-size: 14px; 
    color: #fff; 
    width:auto;        
    background-color: #0E0EFF; 
    display:inline-block; 
    margin:auto; 
    padding: 3px; 
    border-radius: 2px;
}

这回答了你的问题吗

格罗特，杰伦能为你工作吗

CSS:

HTML

测试

---

尽量不要使用位置，除非你真的需要

“我想要的是有一定宽度的背景颜色的文本（所以不要从左到右展开）”，这是违背自然的。非常感谢您的回复。这太接近我需要的了。但问题是，文本仍有一半在我的特征图像后面，而我需要它在前面。这就是为什么我使用这个位置：绝对。有什么解决办法吗？

.center_title {
    margin-left:auto;
    margin-right:auto;
}
.post_title {
    font-family: sans-serif;
    font-size: 14px;
    color: #fff;
    text-align:center;
    background-color: #0E0EFF;
    display:table;
    margin:auto;
    width: 40%;
    padding: 3px;
    border-radius: 2px;
}

<div class="center_title">
    <div class="post_title">test</div>
</div>