Untuk menyisipkan CSS ke dalam dokumen XHTML dapat dilakukan dengan berbagai cara. Cara-cara itu adalah

1. Dengan lembar gaya tertanam
   Dalam embedded style sheet ini kita menggunakan tag
   Contoh penggunaannya
   
   tubuh
   {
   warna. biru;
   }
    
   Pada metode ini kita hanya menggunakan satu file yaitu file XHTML itu sendiri
2. Tautan ke lembar gaya eksternal
   Dalam metode ini, kita membuat file CSSnya terpisah dengan dokumen XHTML. Untuk menghubungkan XHTML dengan cssnya kita menggunakan tag dengan format
   
   Atribut rel="stylesheet" menunjukkan bahwa hubungan antara dokumen tertaut dan dokumen tertaut adalah sebuah stylesheet
   Atribut href berisi lokasi dari file CSS, lokasi ini bisa absolut atau relatif
   Atribut type=”text/css” menunjuk ke tipe MIME
   Metode ini banyak digunakan untuk memisahkan data dari tampilan. Tampilan yang berisi tata letak dan desain ditempatkan di CSS. Dengan demikian pada file XHTML data akan tampil dengan jelas. Perubahan tampilan dan desain dilakukan dengan mengubah CSS. Dengan cara ini akan mudah untuk mengubah desain seluruh website karena kita hanya mengubah file CSS
3. Impor ke eksternal dengan impor
   Cara ini sama dengan cara 2 tetapi dengan menggunakan format seperti
   
   @import url(jalur ke css);
    
   Path ke CSS bisa absolut atau relatif
4. Gaya sebaris
   Dalam metode ini, gaya diterapkan langsung ke tag XHTML
   Contoh
   Hanya menguji
   Cara ini tidak dapat dilakukan terus menerus karena menyebabkan tercampurnya data dan tampilan. Hanya dalam kondisi darurat metode ini bisa dilakukan.  

Kunjungi www. proweb. bersama. id untuk menambah wawasan anda

Memasukkan CSS ke dalam dokumen XHTML

CSS adalah singkatan dari Cascading Style Sheet yang fungsi utamanya mengatur tampilan elemen yang ditulis dalam dokumen HTML. Bahasa ini memiliki peran penting untuk memperindah antarmuka website. CSS adalah salah satu bahasa yang wajib diketahui saat belajar membuat website. Tanpa itu, tampilan website akan kurang menarik, dan butuh usaha lebih untuk melakukan perubahan pada elemen tampilan. CSS berguna untuk mengatur jenis font, warna teks, dan latar belakang halaman. Dan juga berguna untuk mengatasi keterbatasan HTML dalam mengatur format halaman website. CSS sering dianggap sebagai bahasa pemrograman. Nah, CSS lebih tepat disebut sebagai bahasa style sheet yang umumnya digunakan bersamaan dengan JavaScript. Ada tiga cara untuk menambahkan data CSS ke dokumen HTML sebagai berikut

1. Inline CSS adalah cara menambahkan CSS dengan menggunakan atribut style pada tag pembuka elemen HTML. Cara ini biasanya di gunakan untuk memberi gaya atau style unik pada suatu elemen. Inline CSS di gunakan untuk tag HTML tertentu. Atribut digunakan untuk memebrikan style ke tag HTML tertentu. Cara ini kurang di rekomendasikan, karena setiap tag HTML harus di berikan style masing-masing. Akan lebih sulit jika dalam mengatur website jika hanya menggunakan inline CSS. Namun, di beberapa situasi justru inlien CSS menjadi berguna. Contohnya, pada saat tidak memiliki akses ke file CSS atau harus mengubah style untuk 1 elemen saja. Manfaat pada inline CSS adalah berguna untuk perbaikan cepat dan permintaan HTTP yang lebih kecil. Namun sayangnya inline CSS harus di terapkan pada setiap emelen. Contoh halaman HTML dengan inline CSS sebagai berikut :

Tutorial Hostinger

Sesuatu yang berguna di sini.

• Internal CSS merupakan cara menambahkan CSS dengan menggunakan tag di dalam tag . Cara ini di peruntukkan untuk mengatur style untuk satu halaman website. CSS internal diletakkan di dalam bagian pada halaman. Class dan ID bisa di gunakan untuk merujuk pada kode CSS, namun hanya akan aktif pada halaman tersebut. Style CSS yang di pasang dengan metode ini akan di download setiap kali halaman di panggil, jadi ini akan meningkatkan kecepatan akses. Manfaat internal CSS adalah perubahannya hanya terjadi pada 1 halaman, Class dan ID bisa di gunakan oleh internal stylesheet, dan tidak perlu  meng-upload beberapa file karena HTML dan CSS bisa di gunakan di file yang sama. CSS internal diletakkan di dalam tag , contohnya :

p {warna. putih; . 10px;}

    . tengah {tampilan. blok; . 0 otomatis;}

#button-go, #button-back {border. padat 1px hitam;}

• Eksternal CSS adalah cara menambahkan CSS dengan menggunakan tag yang di definisikan pada setiap dokumen HTML. Cara ini merupakan cara yang paling umum di gunakan oleh para pengembang, karena dengan cara ini memungkinkan kita untuk membuat hanya satu style CSS yang kemudian dapat di terapkan ke semua halaman website. Untuk menerapkan cara ini, perlu menulis kode CSS secara terpisah dari dokumen HTML. Kemudian dokumen HTML dan file dari kode CSS tadi selanjutnya di hubungkan dengan menggunakan tag yang didefinisikan paad bagian dalam dokumen HTML. Manfaat CSS eksternal yaitu ukuran file HTML menjadi lebih kecil dan strukturnya lebih rapi, kecepatan loading menjadi lebih cepat, dan file CSS yang sama bisa di gunakan di banyak halaman. File  CSS eksternal biasanya diletakkan setelah bagian pada halaman :

Pada contoh di atas file style. css berisi semua aturan. Sebagai contoh

            . xleftcol {

mengambang. kiri;

lebar. 33%;

Latar Belakang. #809900;

}

xmiddlecol {

mengambang. kiri;

lebar. 34%;

Latar Belakang. #eff2df;

}

Itulah tiga cara menambahkan data CSS ke dokumen HTML

Editor. Erna Febriani

Bagikan ini

• Klik untuk berbagi di Twitter(Buka di jendela baru)
• Klik untuk berbagi di Facebook(Membuka di jendela baru)

Terkait

Bagaimana cara menulis CSS?

Penulisan CSS di mana fungsi CSS yang ditulis dalam dokumen HTML disebut?

Di mana CSS dibuat pada CSS internal?

Berapa banyak cara untuk menggunakan CSS?

Dalam menambahkan CSS pada HTML ada 3 cara yang dapat digunakan, yaitu cara menambahkan SCC langsung pada halaman HTML disebut?

Syarat penulisan kode CSS harus di tag apa?