Bagaimana untuk Menukar Warna Teks `` Tertentu dalam Dropdown ``?

Menukar Warna Teks sesuatu dalam

Apabila cuba mengubah suai warna teks pilihan pertama dalam senarai juntai bawah, anda mungkin menghadapi kesukaran menggunakan kelas CSS. Berikut ialah penyelesaian:

Untuk menukar warna pilihan pertama sahaja, gunakan gaya sebaris terus pada pilihan itu:

<code class="html"><option style="color: grey" value="null">select one option</option></code>

Pendekatan ini memastikan gaya hanya terpakai pada pilihan pertama , meninggalkan baki pilihan dengan warna hitam lalainya.

Untuk menyesuaikan lagi gaya pilihan lain, buat kelas CSS bernama "lain-lain":

<code class="css">.others {
    color: black;
}</code>

Kemudian, tambahkan " lain" kepada pilihan yang tinggal:

<code class="html"><option value="1" class="others">one</option>
<option value="2" class="others">two</option></code>

Ini akan menetapkan semua pilihan kecuali yang pertama kepada hitam. Gabungan penggayaan sebaris dan kelas CSS memastikan pilihan pertama kekal kelabu manakala yang lain berwarna hitam.

Atas ialah kandungan terperinci Bagaimana untuk Menukar Warna Teks `` Tertentu dalam Dropdown ``?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber：php.cn

Artikel sebelumnya：Bagaimana untuk Memusatkan Kapsyen Karusel Bootstrap Secara Menegak dan Meletakkannya Sedikit ke Kiri? Artikel seterusnya：Bagaimana untuk Mencapai Saiz Semula Dinamik untuk Modal Bootstrap Berdasarkan Kandungan?

Kenyataan Laman Web ini

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel terbaru oleh pengarang

Isu terkini

function_exists() tidak boleh menentukan fungsi tersuai Ujian fungsi () {return true;} jika (function_exists ('test')) {echo "test is functio...

daripada 2024-04-29 11:01:01

0

2

1681

Bagaimana untuk memaparkan versi mudah alih Google Chrome Hello cikgu, bagaimana saya boleh menukar Google Chrome kepada versi mudah alih?

daripada 2024-04-23 00:22:19

0

10

1833

Tetingkap anak mengendalikan tetingkap induk, tetapi output tidak bertindak balas. Dua ayat pertama boleh dilaksanakan, tetapi ayat terakhir tidak boleh dilaksanakan.

daripada 2024-04-19 15:37:47

0

1

1560

Tiada output dalam tetingkap induk document.onclick = function(){ window.opener.document.write('Saya adalah output tetingkap ...

daripada 2024-04-18 23:52:34

0

1

1466

Di manakah perisian kursus tentang pemetaan minda CSS? Perisian kursus

daripada 2024-04-16 10:10:18

0

0

1517

Topik-topik yang berkaitan

Lagi>

• Pengenalan kepada komponen laravel
• Penjelasan terperinci tentang konfigurasi nginx
• Apakah perbezaan antara hibernate dan mybatis
• penggunaan velocitytracker
• Apakah teknologi keselamatan rangkaian?
• Proses jual beli Bitcoin di Huobi.com
• Kod skrin biru komputer 0xc0000225
• Peranan atribut padding dalam css

Cadangan popular

• Bagaimana untuk menetapkan css untuk melebihi elips paparan
• css怎么设置字体大小
• css中的hover怎么用
• Bagaimana untuk menetapkan jarak aksara dalam css
• css3新特性有哪些

Tutorial Popular

Lagi>

Tutorial berkaitan

Cadangan popular

Kursus terkini

• 
  Tutorial video perdana dunia ThinkPHP 5.1 terkini (60 hari untuk menjadi kursus latihan dalam talian pakar PHP)

  1415308
• 
  Tutorial pengenalan PHP satu: Belajar PHP dalam satu minggu

  4253378
• 
  Tutorial Video Permulaan JAVA

  2462251
• 
  Pengenalan berasaskan sifar Little Turtle untuk mempelajari tutorial video Python

  502670
• 
  Tutorial pengenalan berasaskan sifar PHP

  842921

• 
  Tutorial video perdana dunia ThinkPHP 5.1 terkini (60 hari untuk menjadi kursus latihan dalam talian pakar PHP)

  1415308 kali belajar
• 
  Tutorial Video Permulaan JAVA

  2462251 kali belajar
• 
  Pengenalan berasaskan sifar Little Turtle untuk mempelajari tutorial video Python

  502670 kali belajar
• 
  Pengenalan pantas kepada pembangunan bahagian hadapan web

  215166 kali belajar
• 
  Kuasai tutorial video PS dari awal

  873451 kali belajar

• 
  [Web front-end] Permulaan pantas Node.js

  6108 kali belajar
• 
  Koleksi lengkap kursus timbunan penuh pembangunan web asing

  4664 kali belajar
• 
  Gunakan GraphQL praktikal bahasa

  4018 kali belajar
• 
  Master kipas 550W mempelajari JavaScript dari awal langkah demi langkah

  600 kali belajar
• 
  Sarjana Python Mosh, seorang pemula dengan pengetahuan asas sifar boleh bermula dalam masa 6 jam

  20454 kali belajar

Muat turun terkini

Lagi>

kesan web

Kod sumber laman web

Bahan laman web

Templat hujung hadapan

• [butang borang] kod hubungan borang mesej perusahaan jQuery
• [Kesan khas pemain] Kesan main balik kotak muzik MP3 HTML5
• [Navigasi menu] HTML5 kesan khas menu navigasi animasi zarah sejuk
• [butang borang] jQuery bentuk visual seret dan lepas kod penyuntingan
• [Kesan khas pemain] Kod pemain muzik Kugou tiruan VUE.JS
• [kesan khas html5] Permainan kotak menolak html5 klasik
• [Gambar kesan khas] menatal jQuery untuk menambah atau mengurangkan kesan imej
• [Kesan album foto] Kesan zum hover kulit album peribadi CSS3

• [Templat bahagian hadapan] Templat Laman Web Syarikat Pembersihan dan Pembaikan Hiasan Rumah
• [Templat bahagian hadapan] Templat halaman panduan resume peribadi berwarna segar
• [Templat bahagian hadapan] Templat Web Resume Kerja Kreatif Pereka
• [Templat bahagian hadapan] Templat laman web syarikat pembinaan kejuruteraan moden
• [Templat bahagian hadapan] Templat HTML5 responsif untuk institusi perkhidmatan pendidikan
• [Templat bahagian hadapan] Templat laman web pusat membeli-belah kedai e-buku dalam talian
• [Templat bahagian hadapan] Teknologi IT menyelesaikan templat tapak web syarikat Internet
• [Templat bahagian hadapan] Templat laman web perkhidmatan perdagangan pertukaran asing gaya ungu

• [PNG素材] 可爱的夏天元素矢量素材(EPS+PNG)
• [PNG素材] 四个红的的 2023 毕业徽章矢量素材(AI+EPS+PNG)
• [banner图] 唱歌的小鸟和装满花朵的推车设计春天banner矢量素材(AI+EPS)
• [PNG素材] 金色的毕业帽矢量素材(EPS+PNG)
• [PNG素材] 黑白风格的山脉图标矢量素材(EPS+PNG)
• [PNG素材] 不同颜色披风和不同姿势的超级英雄剪影矢量素材(EPS+PNG)
• [banner图] 扁平风格的植树节banner矢量素材(AI+EPS)
• [PNG素材] 九个漫画风格的爆炸聊天气泡矢量素材(EPS+PNG)

• [Templat bahagian hadapan] Templat Laman Web Syarikat Pembersihan dan Pembaikan Hiasan Rumah
• [Templat bahagian hadapan] Templat halaman panduan resume peribadi berwarna segar
• [Templat bahagian hadapan] Templat Web Resume Kerja Kreatif Pereka
• [Templat bahagian hadapan] Templat laman web syarikat pembinaan kejuruteraan moden
• [Templat bahagian hadapan] Templat HTML5 responsif untuk institusi perkhidmatan pendidikan
• [Templat bahagian hadapan] Templat laman web pusat membeli-belah kedai e-buku dalam talian
• [Templat bahagian hadapan] Teknologi IT menyelesaikan templat tapak web syarikat Internet
• [Templat bahagian hadapan] Templat laman web perkhidmatan perdagangan pertukaran asing gaya ungu

Tentang kita Penafian Sitemap

Laman web PHP Cina：Latihan PHP dalam talian kebajikan awam，Bantu pelajar PHP berkembang dengan cepat！