我希望文字覆盖始终居中的图像。以下代码实现了这一点。但是,我还有一个要求,即我希望文本本身是左对齐的,而不是居中的,并且我想为文本指定100px的宽度,以便单词换行。我怎样才能做到这一点?
<div id="typewritter-text">
<span id='typewritter'>Lorem Ipsum</span>
</div>
#typewritter-text {
color: white;
position: absolute;
left: -65px;
position:absolute;
text-align:center;
top: 400px;
width: 100%;
}
答案 0 :(得分:1)
您正在CSS中设置text-align:center;
,这会将文本设置为居中对齐。请尝试将其更改为text-align: left;
。
要将文本区域的最大宽度设置为100像素,您可能应该width: 100px;
而不是width:100%;
。
答案 1 :(得分:0)
我做了一个小提琴来演示解决方案:
http://jsfiddle.net/Ar14/gg076ew0/1/
#typewritter-text {
top: 0;
left: 0;
bottom: 0;
margin: auto;
width: 100px;
height: 100px;
position: absolute;
}
这是您想要的CSS。确保父容器也具有相对位置,因为您希望它相对于父容器绝对定位而不是整个页面。