background：currentColor如何添加一行？

在下面的示例（來自Mozilla的網站）：background：currentColor如何添加一行？

<div style="color:darkred"> The color of this text is the same as the one of the line: <div style="background:currentcolor; height:1px"></div> Some more text. </div>

Please take a look at this corresponding jsfiddle link.

如果我刪除：從風格「背景currentColor」，該行就吸引消失。這樣的風格如何增加一條線？

謝謝。

來源

2012-03-12 Sabuncu

如果你能告訴我們爲什麼你在那裏有空的div，高度爲1px，這將有所幫助。該線不消失，它的顏色只是變成了白色。（身體的顏色） – anothershrubery 2012-03-12 14:53:40

你可能想看看http://www.webdesignfromscratch.com/html-css/css-block-and-inline/ – 2012-03-12 14:54:54

@anothershrubery：正如我所說的，我把這個例子當作來自Mozilla：https：//developer.mozilla.org/en/CSS/color_value#currentColor_Keyword – Sabuncu 2012-03-12 15:02:51

由於div具有一個像素的高度（1px的），這意味着它是呈現爲線 - 即，因爲沒有的內它的x像素高度內容，它尺寸本身適當的（如果沒有指定height那麼它將摺疊爲0）。因此，因爲div有一個背景顏色（與渲染顏色不匹配（如果顏色確實匹配，會產生隱形幻象）），您會看到該顏色的一條像素高度線。

想象一下把一個盒子或摺疊的紙砸碎：你不能使它完全消失（不存在，或者當前的形式，至少不是很容易），並且在把你自己水平放在它坐的平面上，仍然會看到它（或其顏色/陰影等）

當然，只專注於那一個不是一個解決方案不會太有用，儘管其他人來幫助：使用一個span元素在文本中對文本進行「分組」文本時，默認情況下這些文本是inline，只有當文本進入一個文本時才應該輸出權限 - 這會暫時忘記您明確指定了一個值height，這就是我想知道的關於整個場景。

來源

2012-03-12 14:49:58

謝謝。（幾乎是一個令人失望的答案！）我不明白的唯一部分：「背景顏色與呈現它的顏色不匹配（給出隱形幻象）」。如果背景和渲染顏色不匹配，那麼您將具有*可見性*，而不是隱形？我相信我錯過了這裏必不可少的東西。 – Sabuncu 2012-03-12 15:07:52

@Sabuncu是的，我試圖清理我在這一點上的措辭。（： – 2012-03-12 15:12:01

好，再次感謝。 – Sabuncu 2012-03-12 15:14:36

因爲Div是一個塊元素。

<div style="color:darkred"> The color of this text is the same as the one of the line: <span style="background:currentcolor; height:1px"></span> Some more text. </div>

來源

2012-03-12 14:49:07

謝謝，標記+1。 – Sabuncu 2012-03-12 15:08:59

background：currentColor如何添加一行？

回答

相關問題