CSS Internal

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

Internal CSS adalah cara untuk menambahkan gaya CSS ke dokumen HTML dengan menempatkannya di dalam tag <style> pada bagian <head> dokumen. Cara ini memungkinkan kamu menerapkan gaya ke beberapa elemen pada satu halaman tanpa memerlukan stylesheet eksternal. Internal CSS berguna untuk mengatur gaya 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 pada semua elemen di dalam dokumen HTML.

Tantangan

Mudah

Kamu diberi dokumen HTML. Gunakan CSS internal untuk memberi gaya pada 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>