Hai teman-teman? apa kabar semuanya, kita telah membahasa tentang banyak sekali propertis yang ada pada css dan bagi teman-teman yang sering bergelut dengan css pasti sering menemukan suatu propertis diberikan nilai inherit pada cssnya,
seperti script dibawah ini:
|
1 2 3 4 |
span { color: blue; border: 1px solid black; } |
mungkin teman-teman masih bingung, maksud dari propertis diberikan nilai inherit apa? oleh karena itu disini kita akan belajar tentang fungsi inherit CSS.
Fungsi dari nilai inherit ialah untuk menirukan style pada element yang sebelumnya kita berikan style, maksudnya ialah inherit merupakan nilai turunan dari suatu element terhadap element terluarnya, dan untuk lebih jelas, sekarang kita akan coba praktekkan, sekarang silahkan teman-teman buat sebuah file dan ketikan script berikit ini :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<!DOCTYPE html> <html> <head> <style> div { color: red; border: 1px solid black; } div a{color:inherit} </style> </head> <body> <div> Here is <span>a span element</span> which is blue, as span elements are set to be. <a href="">a span element</a> </div> </body> </html> |
pertama saya membuat div dimana didalam div tersebut ada 2 element html yaitu span dan link, lalu saya mengatur css seperti ini :
|
1 2 3 4 5 6 7 8 |
<style> div { color: red; border: 1px solid black; } div a{color:inherit} </style> |
saya memberikan style div warna tulisan merah dan border 1 px warna hitam, Â element a adalah unik karena dia tidak akan berubah sebelum elementnya langsung yang kita jadikan selector, di atas saya memberikan stye pada element a yang ada didalam div, yang artinya, style untuk warna text pada element a sama seperti warna text pada pengaturan div atau bisa dibilang menuruni sifat dari element div.
Oke gimana teman-teman? cukup mudah bukan? saya kira untuk tutorial kali ini tentang belajar tentang fungsi inherit CSS cukup sampai sini dulu, seoga tutorial yang sangat singkat kali ini dapat bermanfaat untuk teman-teman semuanya, pesan saya jangan pernah merasa puas dan teruslah merasa lapar akan ilmu, sampai jumpa pada tutorial berikutnya,
terimakasih.