相关疑难解决方法(0)

我有背景颜色应用于<span>标签,也有左右padding设置.问题是:当文本被包裹在几行上时,仅应用于每行padding的左(开始)和右(结束),而<span>不是左(开始)和右(结束).

如何将左右两侧padding应用于中间线？

h1 {
  font-weight: 800;
  font-size: 5em;
  line-height: 1.35em;
  margin-bottom: 40px;
  color: #fff;
}
h1 span {
  background-color: rgba(0, 0, 0, 0.5);
  padding: 0 20px;
}

<h1><span>The quick brown fox jumps over the lazy dog.</span></h1>

我想在IE7和IE8中实现框阴影.我没有成功就尝试了一切.这是我用来将彩色阴影应用于div的css:

.bright{
    position: absolute;
    z-index: 1; 
    -moz-box-shadow: 0px -3px 55px 20px #147197;
    box-shadow: 0px -3px 55px 20px #147197;
    -webkit-box-shadow: 0px -3px 55px 20px #147197;
    behavior: url(ie-css3.htc);
}

这个ie-css3.htc文件是IE阴影问题的解决方案.但它只提供黑色阴影,而不是色彩阴影.我试过了:

filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=100, Strength=13);

但它会产生一个方向性的阴影,我想要一个全方位的阴影.还试过模糊滤镜,但它需要有额外的div,这在我目前的情况下是不可取的.有关这个问题的专家意见吗？

我正在尝试将样式应用于HTML文本.我想要的基本上是:

我得到的基本上是:

如您所见,第一行是缩进的,但不是任何其他行.到目前为止,我有一个内部的文本<span>,它嵌套在一个内部<div>.

.slide-text .text {
  background-color: rgba(0, 0, 0, .6);
  color: #FFF;
  padding: 8px 17px;
}
.slide-text .slide-title {
  font-family: "Titillium Web", Arial, Helvetica, sans-serif;
  font-weight: 700;
}
.slide-text .slide-content {
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
  font-weight: 500;
}

My HTML code is:
<div class="slide-text">
  <div class="slide-title"><span class="text">[TITLE]</span>
  </div>
  <div class="slide-content"><span class="text">[TEXT]</span>
  </div>
</div>

只要标题或内容都不超过一行,它们就能很好地工作.一旦它们越过两条或更多条线,跨度就会失去其内部衬垫.更改内部跨度,display: inline-block;一旦进入两行,就会显示一个块.有没有办法获得我想要的效果？