Contoh penggunaan svg dlm situs dan css nya

Sebelum ini, situs ini tidak menggunakan gambar svg, kebanyakan background atau icon menggunakan gambar png. Tapi karna svg lebih jernih dan tajam gambarnya, dan katanya lebih ringan, akhirnya mau tak mau coba juga gunakan svg untuk mengganti gambar png.

Salah satu svg dalam situs ini adalah triangle/segitiga pada tooltip ini;

Svg untuk pasang di situs

Supaya mudah di sesuaikan, saat membuat svg di situs generator svg, pilih tipe svg yang simple, dan yang sudah kita pahami cara kustomisasi cssnya, misal yang pake stroke atau fill saja dan gambarnya.

Dan untuk lebar dan tinggi svg, bisa di atur menggunakan css saja. Ini untuk desain lanjutan, misalnya untuk desain yang responsive, di layar berapa tinggi lebar svg mau diubah tambah css lagi dengan kontrol media ;

@media screen and (min-width : 1440px) {
svg {width:45px;height:45px;}
}

Tentang Author

St

Dikirim pada -5 Nov 2023
" Selamat datang, selamat membaca dan selamat berseluncur "

San Tuy

Share ke

Lainnya oleh Santuy :