Bagaimana merubah a link color Bootstrap 4

Halo selamat siang agan2, Bagaimana cara merubah warna text link punya bootstrap, warna standartnya itu biru #007bff, saya mau ubah warna sesuai yang saya mau, saya udah coba ubah dan pakai !important tetep gak mau.

Mohon bantuannya, Terima kasih.

avatar suhen
@suhen

40 Kontribusi 2 Poin

Diperbarui 5 tahun yang lalu

12 Jawaban:

Tambah klas baru aja, Misal

Nanti br rubah di style.css

Atau langsung masuk di file bootstrap.css nya cari di situ, bisa inspect Element dulu di browser buat cari tahu ada di Line sebelah mana.

Ada juga lewat file sass style.scss tp ini kudu pake node.js dan git, aga ribet tapi kalo udah berhasil enak, gampang rubah file2 dr bootstrap pake file sass Soalnya bootstrap sendiri juga pake sass setau aku.

Cmiiw

avatar freshgreen
@freshgreen

17 Kontribusi 4 Poin

Dipost 6 tahun yang lalu

semoga membantu

 <a href="https://www.google.co.id" style="color: red;">google</a>

button link bootstrap

 <button type="button" class="btn btn-link" style="color: red;">Link</button>
avatar dianarifr
@dianarifr

642 Kontribusi 316 Poin

Dipost 6 tahun yang lalu

Agan @freshgreen dan @dianarifr,

Terima kasih infonya, kalau nantinya text diambil dari database, class gak akan bekerja.

Maksud saya seperti contoh dibawah ini, isi content yang dibuat dibackend, misalnya dalam 1 paragraf tsb mengandung sebuah link. Nah link ini mau saya bisa otomatis berubah warna sesuai warna a link yang saya mau.


<div id="tentang-kami">
			<h1><?php echo $data_tentang['judul']; ?></h1>
			<h2><?php echo $data_tentang['subjudul']; ?></h2>
			<?php echo $data_tentang['content']; ?>
		</div>

Yang jadi masalah saya menggunakan cdn bootstrap, jadi gak bisa diedit.

avatar suhen
@suhen

40 Kontribusi 2 Poin

Dipost 6 tahun yang lalu

kalau boleh tau model text link yang diambil dari database gimana gan?

avatar dianarifr
@dianarifr

642 Kontribusi 316 Poin

Dipost 6 tahun yang lalu

div#tentang-kami a{
    color: yellow !important;
}

Kalau gk bisa mungkin nyangkut.. coba masuk developer tools F12 , klik kanan tombol reload > empty cache and hard reload...

avatar ciloxz
@ciloxz

284 Kontribusi 139 Poin

Dipost 6 tahun yang lalu

maaf agan @dianarifr, mksdnya gimana ya?

avatar suhen
@suhen

40 Kontribusi 2 Poin

Dipost 6 tahun yang lalu

Agan @ciloxz,

udah gan ttp gak mau.

CSS nya, mpstyle.css punya saya a nya dicoret.

avatar suhen
@suhen

40 Kontribusi 2 Poin

Dipost 6 tahun yang lalu

coba taruh internal css.. di file yg bersangkutan ..dan pastikan parent nya..bener div#footer-about {}

<style type="text/css">
   div#footer-about a{
      color: yellow !important;
   }
</style>

Kalau ditaruh di link ... letakkan dibagian paling bawah..

 <link rel="stylesheet" href="assets/css/bootstrap.css" />
<link rel="stylesheet" href="assets/css/style.css" /> <!-- Paling Bawah -->
avatar ciloxz
@ciloxz

284 Kontribusi 139 Poin

Dipost 6 tahun yang lalu

kalau sepengalaman saya gan saya ngubahnya di style yang saya buat sendiri. jadi misalkan kita make css dari bootstrap untuk mengubah warna link seperti yang agan tanyakan cukup di tabahkan aja di style classnya !important;

atau kalau agan bingun tambah saja class nya kemudia kasih stylenya contoh


<a herf="#" class="warna">klik di sini</a>

stylenya seperti ini


.warna{
color: #warna !important;
}

avatar archiron14
@archiron14

6 Kontribusi 0 Poin

Dipost 6 tahun yang lalu

Saya juga kaya @archiron14 tinggal timpa class yang lama kasih !important biar nanti di ekseskusi terus yang default di hilangkan

avatar markeronly
@markeronly

378 Kontribusi 230 Poin

Dipost 6 tahun yang lalu

Terima kasih agan2 yg sudah memberikan jawaban-jawaban yang luar biasa, dari sana saya belajar dan dapat menyimpulkan.

Karena saya menggunakan CDN Bootstrap maka link a nya memang gak bisa diubah, kecuali di overriding dengan tambahan class atau inline css.

Sekali lagi terima kasih buat agan-agan yang telah membantu saya.

avatar suhen
@suhen

40 Kontribusi 2 Poin

Dipost 6 tahun yang lalu

Sya mempunyai problem yg sama, berikut solusinya

style.css antum

a { color:inherit }

avatar kiki20
@kiki20

7 Kontribusi 0 Poin

Dipost 5 tahun yang lalu

Login untuk ikut Jawaban