Cara Membuat Styles Eksternal di CSS3 - dummies

Sebagian besar pengembang menggunakan gaya eksternal di CSS3 untuk mengurangi jumlah pekerjaan yang dibutuhkan untuk memelihara situs. Tunggal. File CSS berisi semua gaya untuk situs, yang berarti bahwa mengubah gaya secara keseluruhan situs semudah mengubah satu file itu (bukan setiap halaman). Karena perubahan hanya terjadi di satu tempat, tidak ada kemungkinan kehilangan satu atau lebih perubahan pada setiap halaman.

Membuat dan menggunakan lembar gaya eksternal tidak jauh berbeda dengan menggunakan lembar gaya internal. Contoh berikut menggunakan teknik standar untuk membuat style sheet eksternal:

1. Buat file HTML5 baru dengan editor teks Anda.

2. Ketik kode untuk halaman HTML.

   Halaman Sederhana
   Judul yang Sederhana
   Teks sederhana untuk mengikuti judul.
   

   Pastikan Anda mengetikkan kode dengan tepat. Apa yang harus Anda akhiri adalah halaman biasa - satu tanpa gaya apapun.

3. Ketik kode berikut segera setelah tag.

   Tag memberitahu browser untuk mencari sumber daya eksternal. Dalam kasus ini, atribut rel mengatakan bahwa ia harus mencari style sheet dan atribut href memberikan nama style sheet tersebut.

4. Simpan file HTML5 ke disk.

5. Buat yang baru. File CSS dengan editor teks Anda.

   Editor Anda mungkin tidak mendukung. File CSS File teks apapun yang akan dilakukan

6. Ketik kode berikut di. File CSS

   p {font-family: kursif; ukuran huruf: besar; warna: # 0000ff; background-color: # ffff00;} h1 {font-family: "Times New Roman", Georgia, serif; ukuran font: 40px; text-align: center; hiasan teks: garis bawah; warna: # ff0000; background-color: # 00ffff;}
   

   Ini mungkin kode yang sama dengan yang Anda gunakan untuk membuat file internal Anda. Satu-satunya perbedaan adalah sekarang berada di file eksternal.

7. Simpan file CSS ke disk sebagai ExternalCSS. CSS.

   Sangat penting bahwa nama file cocok dengan nama yang ditemukan di atribut href. Beberapa platform bersifat case sensitive, jadi Anda harus menggunakan kasus yang sama untuk nama file. Misalnya, externalcss. css bisa dilihat sebagai file yang berbeda dari ExternalCSS. CSS.

8. Muat halaman di browser Anda.