Bagaimana cara menghapus warna tautan default dari tag html hyperlink 'a'?

236

Warna tautan default adalah biru. Bagaimana cara menghapus warna tautan default dari tag html hyperlink <a>?

— Rafiu
sumber

Warna teks standar <a>adalah biru. Apa masalahmu sekarang?

— VMAtm

Saya mencoba untuk mendapatkan jika tidak memberi warna pada <a>, saya tidak ingin itu ditampilkan dalam warna biru. Dalam warna teks default, warna teks mungkin hitam atau biru seperti itu ...

— Rafiu

3

@Terry_Brown - Saya menemukan pertanyaan ini cukup berguna, karena saya ingin menemukan jawaban "color: inherit" di bawah ini, yang menurut saya juga berkaitan dengan pertanyaan itu ...

— Sk93

475

Nilai bawaan :

a { color: inherit; }

... akan menyebabkan elemen mengambil warna induknya (yang saya pikir Anda cari).

— Quentin
sumber

60

Anda dapat melakukan beberapa hal seperti ini:

a {
    color: #0060B6;
    text-decoration: none;
}

a:hover 
{
     color:#00A0C6; 
     text-decoration:none; 
     cursor:pointer;  
}

jika dekorasi teks tidak berfungsi maka sertakan dekorasi teks: tidak ada! penting;

— kleinohad
sumber

selain itu, jika Anda ingin mencegah perubahan warna untuk tautan tertentu setelah menekannya, tambahkan di dalam tag: <A STYLE = "text-decoration: none; color = [pilih favorit Anda ...]" HREF = " tautan.html "> tautan uji </A>

— wiztrail

4

<a style="text-decorations:none; color:inherit;>= menang

— Dan Bradbury

2

@DanBradbury menghapus 's' di dekorasi teks. <a style="text-decoration:none; color:inherit;>

— Mukarram Pasha

18

.cancela,.cancela:link,.cancela:visited,.cancela:hover,.cancela:focus,.cancela:active{
    color: inherit;
    text-decoration: none;
}

Saya merasa perlu untuk memposting definisi kelas di atas, banyak jawaban pada SO merindukan beberapa negara

— Kaan Soral
sumber

17

Jika Anda tidak ingin melihat garis bawah dan warna default yang disediakan oleh browser, Anda dapat menyimpan kode berikut di bagian atas file main.css Anda. Jika Anda membutuhkan warna dan gaya dekorasi yang berbeda, Anda dapat dengan mudah mengganti default menggunakan potongan kode di bawah ini.

 a, a:hover, a:focus, a:active {
      text-decoration: none;
      color: inherit;
 }

— GURU PRASAD
sumber

8

Ini juga mungkin:

        a {
            all: unset;
        }

tidak disetel: Kata kunci ini menunjukkan untuk mengubah semua properti yang berlaku untuk elemen atau induk elemen ke nilai induknya jika mereka dapat diwarisi atau ke nilai awal jika tidak. unicode-bidi dan nilai arah tidak terpengaruh.

Sumber: Mozilla description of all

— gerd hübner
sumber

Anda bisa , tetapi hanya karena Anda tidak bisa berarti Anda harus melakukannya. Saya akan mengatakan mengingat sifat aturan ini Anda harus benar-benar memasukkan sedikit lebih banyak tentang apa yang sebenarnya dilakukannya.

— Tom

1

Ternyata color: unsetjuga berhasil. Saya menghapus warna kerangka dari elemen, lalu membungkus elemen dan mengatur warna kustom saya pada pembungkus itu sehingga warna diwarisi.

— Traxo

8

Anda harus menggunakan CSS. Berikut adalah contoh mengubah warna tautan default, ketika tautan itu hanya duduk di sana, ketika itu sedang melayang dan ketika itu adalah tautan yang aktif.

a:link {
  color: red;
}

a:hover {
  color: blue;
}

a:active {
  color: green;
}

<a href='http://google.com'>Google</a>

Luaskan cuplikan

— Saad Imran.
sumber

6

Cukup tambahkan ini di CSS,

a {
    color: inherit;
    text-decoration: none;
}

itu dia, sudah selesai.

— ArifMustafa
sumber

1

Saya tidak tahu, apa masalahnya dengan pemilih yang turun, percayalah ini berhasil ...

— ArifMustafa

3

Anda dapat menggunakan nilai-nilai Warna Sistem (18.2) , diperkenalkan dengan CSS 2.0, tetapi tidak digunakan lagi dalam CSS 3 .

a:link, a:hover, a:active { color: WindowText; }

Dengan begitu jangkar tautan Anda akan memiliki warna yang sama dengan teks dokumen normal pada sistem ini.

— rajutan
sumber

0

a:link{color:inherit;}

ini adalah satu baris sederhana yang dapat melakukan semua hal untuk Anda <3

— sounish nath
sumber

-2

Ini akan bekerja

    a:hover, a:focus, a:active {
        outline: none;
    }

Apa yang dilakukan adalah menghapus garis besar untuk ketiga kelas semu.

— Sumeet Rohra
sumber

Harap berikan sedikit penjelasan lebih lanjut mengapa ini berhasil.

— mareoraft

Pertanyaannya bukan menanyakan garis besar

— Quentin