Cascading Style Sheets: Perbedaan antara revisi

Konten dihapus Konten ditambahkan
menambahkan judul tingkat 2 baru dengan nama CSS Selector
CSS Selector: sunting isi
Baris 182:
 
=== Type Selector ===
''Type Selectorselector'' merupakan cara penulisan CSS dengan nama elemen sebagai target untuk diterapkannya ''rule''. Ketika menggunakan ''selector'' ini, maka rule akan diterapkan pada seluruh elemen target yang ada pada dokumen HTML.<ref>{{Cite web|title=Type selectors - CSS: Cascading Style Sheets {{!}} MDN|url=https://developer.mozilla.org/en-US/docs/Web/CSS/Type_selectors|website=developer.mozilla.org|language=en-US|access-date=2022-09-11}}</ref><syntaxhighlight lang="css" line="1">
/* akan diterapkan pada seluruh elemen <a>*/
a {
color: blue;
}
</syntaxhighlight>
 
=== ID Selector ===
''ID selector'' menetapkan target elemen berdasarkan nilai dari atribut id yang diterapkan pada elemennya. Agar elemen dapat terpilih, maka atribut '''id''' pada elemen harus sama persis dengan yang ada di selector.<ref>{{Cite web|title=ID selectors - CSS: Cascading Style Sheets {{!}} MDN|url=https://developer.mozilla.org/en-US/docs/Web/CSS/ID_selectors|website=developer.mozilla.org|language=en-US|access-date=2022-09-11}}</ref><syntaxhighlight lang="html" line="1">
<!DOCTYPE html>
<html lang="en">
 
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
 
<style>
#contoh {
border: black 1px solid;
border-radius: 16px;
}
</style>
</head>
 
<body>
<!-- Elemen dengan id="contoh" -->
<p id="contoh">ini adalah contoh kalimat.</p>
</body>
 
</html>
</syntaxhighlight>