Cara Memformat Situs Web

Situs web yang efektif harus menyampaikan konten kepada pembacanya melalui format yang menarik. Format yang buruk dapat membuat situs web tidak menarik atau bahkan tidak dapat dibaca. Dengan Hypertext Markup Language (HTML), Anda dapat mengontrol pemformatan situs web agar muncul persis seperti yang Anda inginkan. Selain itu, Cascading Style Sheets (CSS) memungkinkan Anda memformat situs web menggunakan style sheet eksternal. Teknik ini berguna jika Anda ingin menerapkan gaya yang sama ke beberapa halaman dalam situs Anda.

Pemformatan HTML

Buat tabel untuk memposisikan berbagai elemen halaman Web Anda. Gunakan

tag untuk memulai tabel itu sendiri. Gunakan tag untuk memulai baris tabel, dan a

tag untuk membuat sel data tabel di dalam baris. Tabel data sel biasanya dapat dianggap sebagai kolom tabel. Untuk memposisikan elemen Anda secara memadai, bereksperimen dengan parameter tinggi, lebar, padding, dan spasi masing-masing baris dan sel data.

Tambahkan efek teks dan gaya font dalam tag untuk elemen yang mengandung teks. Misalnya, jika Anda ingin memformat teks dalam elemen paragraf:

Ini akan membuat konten paragraf dalam font Comic Sans.

Tambahkan latar belakang ke seluruh situs web Anda di tag, dengan menggunakan atribut bgcolor. Sebagai contoh:

Ini menjadikan latar belakang seluruh halaman dalam warna mawar.

CSS dan Lembar Gaya Eksternal

Buka dokumen teks baru di Notepad.

Format setiap elemen dalam dokumen baru Anda. Gunakan tag elemen diikuti oleh braket terbuka untuk memperkenalkan gaya untuk elemen itu. Sebagai contoh:

p {

font-family: "comic sans ms";

background-color :: # CC3366;

}

Setiap paragraf dalam dokumen HTML Anda akan memiliki font Comic Sans dan memiliki warna latar belakang mawar.

Gunakan ID atau kelas jika Anda ingin memperkenalkan gaya yang akan digunakan di berbagai jenis elemen atau dalam kasus individu. ID hanya dapat digunakan satu kali, dan diperkenalkan oleh simbol "#". Kelas dapat digunakan beberapa kali, dan dilambangkan dengan "." simbol. Sebagai contoh:

.comicrose {

font-family: "comic sans ms";

background-color :: # CC3366;

}

Kelas ini memungkinkan Anda untuk mendesain elemen dengan Comic Sans dan latar belakang mawar dimanapun Anda memanggil kelasnya. Misalnya, dalam kode HTML untuk halaman Anda,

gaya paragraf seperti yang dijelaskan.

Tautkan ke style sheet eksternal di bagian kode HTML Anda. Sebagai contoh:

Tautan ini ke style sheet eksternal yang disebut pagestyles.css.