Firefox中可調整大小的textarea的背景色

我想將我網站上幾個textareas的背景色設置爲白色以外的東西。Firefox中可調整大小的textarea的背景色

textarea 
 
{ 
 
    background-color:Red; 
 
    width:120px; 
 
    height:80px; 
 
}

<textarea>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</textarea>

上面的代碼工作完全正常，當應用在Firefox中一個可調整大小的文本區域也有一個滾動條除外。

textarea右下角的背景和可拖動的角落變成紅色，滾動條保持不變，但由於可拖動的角落在滾動條下方，所以看起來很愚蠢。
是否有任何方法可以使滾動條着色或不着色，最好只使用CSS？

來源

2016-12-08 sandbo00

可能的重複：http://stackoverflow.com/a/14150577/3244407 – Ethan

??這是如何重複的？ ** OP要求「Firefox中的textarea grabber」，並且您鏈接了一個滾動條**？也許它可以或不可以有答案，但肯定不是重複的。有人甚至提高了這一點？ –

@NikhilNanjappa爲了公平起見，我沒有寫滾動條着色是一種可以接受的選擇，儘管我寧願排除抓取器，但我真的不喜歡使用JavaScript。我可以看到一個人可能會認爲這可能是重複的，但我真的認爲這個問題是不同的，特別是因爲鏈接的答案實際上只是對我而言「最後的選擇」選項。 – sandbo00

不幸的是，在Firefox中，你不能靈活地使用textarea抓取器（至少現在）。你可以做的最大使用

textarea { 
    resize: none; /* disables resizability */ 
}

其他選項來此found here

但對於WebKit瀏覽器只是禁用它，雖然有幾個選項

你可以用自定義只抓取background-color甚至背景圖片

#textarea::-webkit-resizer { 
    background-color: green; 
} 

#textarea::-webkit-resizer { 
    background-image: url(resizer-background.png); 
}

甚至只是隱藏它 - 這是不一樣的resize: none;，這只是隱藏它不是禁用它

::-webkit-resizer { 
    display: none; 
}

希望你有一個更好的瞭解。

來源

2016-12-08 09:27:43

Firefox中可調整大小的textarea的背景色

回答

相關問題