css修改select选择框option被选中的背景颜色_5个容易忽视的 CSS 属性
生活随笔
收集整理的這篇文章主要介紹了
css修改select选择框option被选中的背景颜色_5个容易忽视的 CSS 属性
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
作者 |?Desiré譯者 |?蘇本如,責編 | 郭芮出品 | CSDN(ID:CSDNnews)
以下為譯文:
各位網友,大家好!?今天,我想在這里和大家分享一些我很晚時候才知道的一些CSS屬性,在此之前,沒有人告訴我這些屬性的存在。也許你們和我不一樣,已經了解了這些屬性。閑話少說,讓我們進入正題吧:?01禁用用戶選中一個元素(element)的文使用屬性user-select,并且將它的值設置為none,我們可以將一個元素的文本設置為不能被用戶選中。element { -webkit-user-select: none; /* Safari */ -ms-user-select: none; /* IE 10+ and Edge */ user-select: none; /* Standard syntax */}當你不想一個元素的原始內容被復制時,可以使用這個屬性。02更改選中文本的背景顏色使用選擇器::selection,可以更改選中文本的背景顏色:::selection { color: #ececec; background: #222831;}當你使用這個屬性時,注意使用良好的顏色對比度組合。03在不使用br的情況下將文本換行使用屬性white-space,并將它的值設置為pre-wrap或pre-line:element { white-space: pre-wrap; /*pre-wrap*/ white-space: pre-line; /*pre-line*/}04設置字與字之間的間距這對你來說可能有點簡單。但是直到我搜索這個需求時,我才知道有這個設置。你可以使用word-spacing這個屬性來設置文本中詞與詞之間的間隔。element { word-spacing: 6px; /* word spacing wow such */}05在瀏覽器中隱藏難看的滾動條我以前甚至不知道這是可以做到的。要實現這個目的,你必須為不同的瀏覽器,準備不同的代碼:/* Hide scrollbar for Chrome, Safari, and Opera */html::-webkit-scrollbar { display: none;}/* Hide scrollbar for IE and Edge */html { -ms-overflow-style: none;}如果你禁用了滾動條,那么你需要確保提供上/下按鈕和其他方便的導航選項。請注意,Firefox停止了對滾動條隱藏問題的支持,以上代碼似乎是一個技巧,可以執行與我包含的其他代碼相同的功能。原文:https://dev.to/helleworld_/5-css-useful-properties-i-ignored-2930本文為 CSDN 翻譯,轉載請注明來源出處。總結
以上是生活随笔為你收集整理的css修改select选择框option被选中的背景颜色_5个容易忽视的 CSS 属性的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 怎么买短期交强险
- 下一篇: python代码生成可执行程序_Pyth