Question

希望这是一个简单的问题，我有空白的时刻。我试图在我的HTML中设置一个Span标签（与一个jquery块绑定）。

我的SHOW跨度是我设置的背景而不是宽度。而HIDE中心，并具有适当的宽度。不确定为什么。我错过的是阻止第一个跨度＆＃34; SHOW＆＃34;风格完全？小提琴下面。

.slider{
display:none;
}
.collapseSlider{
display:none;
}
.sliderExpanded .collapseSlider{
display:block;
width: 100%;
text-align: center;
}
.sliderExpanded .expandSlider{
  display:none;
}
.dark {background:#0082d1; text-align: center; width: 100%;}
.light {background:#003a6f; text-align: center; width: 100%;}  

<p class="toggler" id="toggler-slideOne">
<span class="expandSlider dark">SHOW</span><span class="collapseSlider dark">HIDE</span>
 </p>
  <div class="slider" id="slideOne">
 <p>Slide One lorem ipsum opsum...</p>
 <span class="closeSlider">Close</span>
 </div>

http://jsfiddle.net/f8xxk/

一如既往地感谢您的时间和持续的支持！

Answer 1

由于span是内联元素（它们忽略width属性），您需要设置浮动到该范围或将显示设置为inline-block以使此范围具有{{} 1}}

width

Fiddle

Answer 2

您无法在内联元素上设置宽度，将其显示属性设置为阻止将是修复它的一种方法。

修改过的小提琴：http://jsfiddle.net/f8xxk/3/

span {
    display: block;
}

样式跨度和Jquery

2 个答案: