我有一个div缠绕在一起span并使用JS来使跨度淡入淡出(用于推荐).一切正常,除了我无法让span文本居中div.这是相关的代码:
HTML -
<div class="slideshow">
<span style="font-size:12px; color:#333333; font-family:Lucida Grande,Lucida Sans Unicode,Calibri,Arial,sans-serif;">Hi</span>
<span style="font-size:12px; color:#333333; font-family:Lucida Grande,Lucida Sans Unicode,Calibri,Arial,sans-serif;">Goodbye</span>
</div><br />
Run Code Online (Sandbox Code Playgroud)
这是幻灯片CSS -
.slideshow {
width:940px;
height:64px;
background-image:url(../images/quotes.png);
}
Run Code Online (Sandbox Code Playgroud)
谁能告诉我我做错了什么?哦,是的,我试过text-align:center;没有运气.
[编辑]我想补充一下,我也尝试过添加!important,没有任何变化.
我测试了你的代码并添加了
.slideshow {
text-align: center;
}
Run Code Online (Sandbox Code Playgroud)
文本中心就好了.
也许你在其他地方有一个拼写错误或css定义会覆盖你的文本对齐?
编辑
我做了一个小提琴的"检查元素",这里是我得到的CSS定义:
<div class="slideshow" style="position: relative; ">
<span style="font-size: 12px; color: rgb(51, 51, 51); font-family: 'Lucida Grande', 'Lucida Sans Unicode', Calibri, Arial, sans-serif; position: absolute; z-index: 3; top: 0px; left: 0px; display: block; width: 13px; height: 15px; opacity: 0.275808; ">Hi</span>
<span style="font-size: 12px; color: rgb(51, 51, 51); font-family: 'Lucida Grande', 'Lucida Sans Unicode', Calibri, Arial, sans-serif; position: absolute; top: 0px; left: 0px; display: block; width: 52px; height: 15px; z-index: 2; opacity: 0.724192; ">Goodbye</span>
</div>
element.style {
color: #333;
display: block;
font-family: 'Lucida Grande', 'Lucida Sans Unicode', Calibri, Arial, sans-serif;
font-size: 12px;
height: 15px;
left: 0px;
opacity: 1;
position: absolute;
top: 0px;
width: 52px;
z-index: 3;
}
Run Code Online (Sandbox Code Playgroud)
我会说"display:block"是你的问题.
| 归档时间: |
|
| 查看次数: |
2309 次 |
| 最近记录: |