Cara menggunakan CSS Function attr()

Hallo teman-teman, pada kesempatan kali ini saya akan memberikan sebuah trik tentang css. Seperti yang saya jelaskan pada artikel saya sebelumnya tentang cara menggunakan fungsi calc , dimana function adalah baris kode yang sudah diatur dengan ketentuan baku untuk dapat langsung digunakan oleh pembuat program.

Jika pada artikel sebelumnya saya membahas tentang fungsi calc(), kali ini saya akanmembahas tentang salah satu function yang ada di css, yaitu attr()

fungsi attr ini adalah memberikan value pada sebuah elemen dengan berdasarkan attribute yang digunakan.

Contoh penggunaannya adalah seperti ini:

diatas saya memiliki tag <a> dengan attribute href yang valuenya http://www.dumetschool.com

selanjutnya adalah kita membuat sebuah style dengan memanfaatkan pseudo content :after dan memberikannya property content.

di dalam content ini lah saya berikan fungsi attr() untuk memunculkan value dari attribute href tersebut.

Maka ketika kita lihat di browser akan terlihat seperti ini.

Seperti yang kita lihat diatas, hasil yang tampil di browser memiliki alamat url sama persis dengan apa yang diketikkan pada value attribute href.

Baiklah teman-teman, demikian pembahasan tentang cara menggunakan css function attr, semoga dapat bermanfaat bagi kalian, terima kasih