1

私が抱えている問題は、このようなものを入れたいということです

<span>CONSEQUAT, VEL ILLUM DOLORE EU FEUGIAT NULLA FACILISIS AT VERO EROS ET ACCUMSAN ET IUSTO ODIO DIGNISSIM QUI BLANDIT PRAESENT LUPTATUM ZZRIL DELENIT AUGUE DUIS DOLORE TE FEUGAIT NULLA FACILISI.</span>

このようなCSSで

span {
    font-size: 25px;
    line-height: 28px;
    color: white;
    background-color: #2EC6C6;
    padding-right: 5px;
    padding-left: 5px;
}

パーセンテージ サイズの div で。行が改行されると、各行に左右にパディングが適用されます。現時点では、文全体の最初と最後にのみ適用されます。

各行を別々のスパンに入れることができることはわかっていますが、動的にしたいので、多くの行を書くことができ、適用できます。

助言がありますか？純粋な CSS を好みますが、JavaScript に移行したいと考えています。

ここにフィドルがあります

4

4 に答える 4

2

ここから：

表示: インラインブロック

インライン ブロックはインライン (つまり、隣接するコンテンツと同じ行) に配置されますが、ブロックとして動作します。

span {
    font-size: 25px;
    line-height: 28px;
    color: white;
    background-color: #2EC6C6;
    padding-right: 5px;
    padding-left: 5px;
    display: inline-block
}

http://jsfiddle.net/DsqY2/

ここに画像の説明を入力 ソース

于 2013-08-02T13:18:24.233 に答える
0

これを試して

授業display:inline-block;中に書いてくださいspan

http://jsfiddle.net/DsqY2/3/

 span {
    font-size: 25px;
    line-height: 28px;
    color: white;
    background-color: #2EC6C6;
    padding-right: 5px;
    padding-left: 5px;
    display:inline-block; /*-add--*/
}
于 2013-08-02T13:19:26.527 に答える
-1

<div>の代わりにを使用するとうまくいきます。こちら<span>を参照してください。

于 2013-08-02T13:20:42.643 に答える