CSS Internal

Termasuk bagian Menata dengan CSS dalam perjalanan HTML di Coddy. Pelajaran 7 dari 76.

Internal CSS adalah metode untuk menambahkan gaya CSS ke dokumen HTML dengan menempatkannya di dalam tag <style> pada bagian <head> dokumen. Pendekatan ini memungkinkan kamu menerapkan gaya ke beberapa elemen dalam satu halaman tanpa perlu menggunakan stylesheet eksternal. Internal CSS berguna untuk mengatur gaya pada satu dokumen atau membuat perubahan gaya dengan cepat.

Berikut sintaks dasar untuk menggunakan CSS internal:

<!DOCTYPE html>
<html>
<head>
    <title>Internal CSS</title>
    <style>
        body {
            background-color: lightblue;
        }
        p {
            color: blue;
            font-size: 16px;
        }
    </style>
</head>
<body>
    <h1>Welcome to My Page</h1>
    <p>This is a paragraph of text.</p>
</body>
</html>

Dalam contoh ini, tag <style> berisi aturan CSS yang mengatur warna latar belakang body menjadi biru muda, warna p (paragraf) menjadi biru, dan ukuran font menjadi 16 piksel. Gaya ini akan diterapkan ke semua elemen dalam dokumen HTML.

Tantangan

Mudah

Kamu diberi dokumen HTML. Gunakan CSS internal untuk menata dokumen dengan properti berikut:

Atur warna latar belakang body menjadi lightgreen.
Atur warna teks semua judul h1 menjadi red.
Atur ukuran font semua paragraf (p) menjadi 18px.

Kamu diberi kode CSS awal untuk dokumen ini.

Coba sendiri

<!DOCTYPE html>
<html>
<head>
    <title>Internal CSS</title>
    <style>
        body {
            
        }
        h1 {
            
        }
        p {
            
        }
    </style>
</head>
<body>
    <h1>This is a heading</h1>
    <p>This is a paragraph.</p>
</body>
</html>