背景色覆蓋前一行

如何修復覆蓋前一行文本的背景色（請參閱：http://jsfiddle.net/3uzbV/41/）。背景色覆蓋前一行

div { 
 
\t font-family: Charis, serif; 
 
    font-size: 1.5em; 
 
    line-height: 0.8em; 
 
    text-align: justify; 
 
} 
 
    
 
span { 
 
    background-color: red; 
 
}

<div> firstString <span> secoundString </span> thirdString </div>

來源

2014-11-24 Radek Wilczak

製作的line-height大或刪除。 – 2014-11-24 12:24:58

我無法更改行高和字體大小。他們必須保持原樣。 – 2014-11-24 12:26:43

我發現這篇大文章：http://krasimirtsonev.com/blog/article/CSS-The-background-color-and-overlapping-rows-inline-element

添加顯示：內聯;到div標籤，位置：相對;到span標籤。

你會得到這樣的：

div { 
    font-family: Charis, serif; 
    font-size: 1.5em; 
    line-height: 0.8em; 
    text-align: justify; 
    display: inline; 
} 

span { 
    background-color: red; 
    position: relative; 
}

見小提琴http://jsfiddle.net/3uzbV/42/

來源

2014-11-24 12:31:41

但紅色背景仍然覆蓋文字。 – 2014-11-24 12:53:28

你的意思是p和g？沒有看到。我不認爲有更好的解決方案。也許這個：http://jsfiddle.net/3uzbV/43/但這就是我能想到的。考慮採用其他解決方案來縮小線路。 – 2014-11-24 13:00:26

背景色覆蓋前一行

回答

相關問題