CASCADING STYLE SHEET(CSS)
Nama file(LatihanCSS.Html)
<!DDOCTYPE html>
<html>
<head>
<title> Latihan CSS</title>
<link rel="stylesheet"type="text/css"href="latihann.css">
</head>
<body>
<a href ="#" class="hello">Hello World</a>
<ul>
<li><a href="#">link 1</a></li>
<li><a href="#">link 2</a></li>
<li><a href="#">link 3</a></li>
<li><a href="#">link 4</a></li>
<li><a href="#">link 5</a></li>
<li><a href="#">link 6</a></li>
<li><a href="#">link 7</a></li>
<li><a href="#">link 8</a></li>
<li><a href="#">link 9</a></li>
<li><a href="#">link 10</a></li>
</ul>
<p>Lorem Ipsum adalah contoh text atau dummy dalam industri percetakan dan penataan huruf atau typesetting.Lorem Ipsum telah menjadi standar contoh text sejak tahun 1500an,saat seorang tukang cetak yang tidak dikenal mengambil kumpulan text dan mencetaknya untuk menjadi sebuah buku
contoh huruf.</p>
<p> Ia tidak hanya bertahan selama 5 abad,tapi juga telah beralih ke penataan huruf elektronik,tanpa ada perubahan apapun.Ia mulai dipopulerkan pada tahun 1960 dengan diluncurkannya lembaran-lembaran letraset yang menggunakan kalimat-kalimat Lorem Ipsum,dan seiring munculnya perangkat lunak desktop publishing seperti Aldus Pake Maker juga memiliki versi leren Ipsum.</p>
</body>
</html>
Nama file(latihan_css).Nama file tsb nantinya akan dimasukan ke file latihanCSS.Html di atas yaitu pada bagian <link rel="stylesheet"type="text/css"href="latihann.css">.bisa dilihat diatas!
li:first-child a{
color:green;
}
/* css carikan a,di dalam li yang merupakan anak pertama*/
li:last-child a{
color:green;
}
/* css carikan a,di dalam li yang merupakan anak terakhir*/
li:nth-child a{
color:green;
}
/* css carikan a,di dalam li yang merupakan anak genap*/
li:nth-child(even) a{
color:green;
}
/* css carikan a,di dalam li yang merupakan anak ganjil*/
li:nth-child(odd) a{
color:violet;
}
/* css carikan p,di dalam halaman yang urutan pertama*/
p:firs-of-type {
color:red;
}
/* css carikan a,di dalam halaman yang urutannya terakhir*/
p:last-of-type {
color:orange;
}
Langganan:
Posting Komentar (Atom)
Pengertian Web Server, Cara Kerja, Fungsi, dan Contohnya
1. Pengertian web server Web server adalah serangkaian perangkat keras ( hardware ) dan perangkat lunak ( software ) di dalam sebuah serve...
-
1. Pengertian web server Web server adalah serangkaian perangkat keras ( hardware ) dan perangkat lunak ( software ) di dalam sebuah serve...
Tidak ada komentar:
Posting Komentar