Soal Latihan Tentang HTML&CSS



1. Bahasa markah standar untuk dokumen yang dirancang untuk dokumen yang dirancang untuk ditampilkan di peramban internet.

2. <html>
    <body>
        <table border="1" cellpadding="8">
            <tr>
                <td>baris 1 kolom 1</td>
                <td colspan="2">baris 2 kolom 1</td>
            </tr>
            <tr>
                <td>baris 1 kolom 2</td>
                <td>baris 2 kolom 2</td>
                <td>baris 3 kolom 2</td>
            </tr>
            <tr>
                <td>baris 1 kolom 3</td>
                <td>baris 2 kolom 3</td>
                <td>baris 3 kolom 3</td>
            </tr>
        </table>
    </body>
</html>

3. <! DOCTYPE html> Deklarasi untuk mendefinisikan dokumen menjadi HTML
<html> Tag pembuka untuk membuat dokumen HTML
<head> Informasi meta tentang dokumen
<title> Membuat judul halaman yang nantinya akan ditampilkan di browser
<body> Tempat dibuatnya semua konten website menggunakan HTML
<p> Membuat paragraf
<br> Membuat garis baru
<pre> Memfortmat teks atau kalimat

4. Cascading Style Sheets (CSS) merupakan bahasa pemrograman yang digunakan untuk menentukan bagaimana dokumen dan website akan disajikan.

5. 1. Selektor Tag

Selektor Tag disebut juga Type Selector. Selektor ini akan memilih elemen berdasarkan nama tag.

Contoh:

p {
    color: blue;
}

2. Selektor Class

Selektor class adalah selektor yang memilih elemen berdasarkan nama class yang diberikan. Selektor class dibuat dengan tanda titik di depannya.

Contoh:

.pink {
  color: white;
  background: pink;
  padding: 5px;
}

3. Selektor ID

Selektor ID hampir sama dengan class. Bedanya, ID bersifat unik. Hanya boleh digunakan oleh satu elemen saja.

Selektor ID ditandai dengan tanda pagar (#) di depannya.

Contoh:

#header {
    background: teal;
    color: white;
    height: 100px;
    padding: 50px;
}

4. Selektor Atribut

Selektor atribut adalah selektor yang memiliki elemen berdasarkan atribut. Selektor ini hampir sama seperti selektor Tag.

Contoh selektor Atribut:

input[type=text] {
    background: none;
    color: cyan;
    padding: 10px;
    border: 1px solid cyan;
}

5. Selektor Universal

Selektor universal adalah selektor yang digunakan untuk menyeleksi semua elemen pada jangkauan (scope) tertentu.

Contoh:

*{
    : 1px solid grey;
}

6. Pseudo Selektor

Pseudo selektor adalah selektor untuk memilih elemen semu seperti state pada elemen, elemen before dan after, elemen ganjil, dan sebagainya.
Contoh:

a:hover {
  color: green;
}

Komentar

Postingan Populer