Ada dua jenis tata letak situs: tabular dan blok. Dan sementara yang pertama lebih nyaman untuk membuat halaman html sederhana, yang terakhir sangat ideal jika Anda perlu menambahkan elemen individual dalam bentuk blok.
instruksi
Langkah 1
Ada dua teknik yang memungkinkan Anda mengembangkan desain blok sendiri: dengan menyematkan lembar gaya berjenjang ke dalam dokumen, atau dengan menghubungkannya dari sumber eksternal. Keduanya memberikan hasil yang sama, sehingga tidak ada perbedaan mendasar di antara keduanya. Dalam kasus pertama, rekatkan kode berikut di mana saja di file style.css:
.blok1 {
}
Block1 - nama blok, Anda dapat menulis yang lain. Di antara kurung kurawal, tentukan parameter dalam format berikut: nama atribut> titik dua> nilai> titik koma (termasuk ditempatkan sebelum kurung kurawal). Elemen-elemen berikut biasanya digunakan:
- lebar - lebar (500px, 100%, dll.);
- tinggi - tinggi (200px, 25%, dll.);
- latar belakang - warna latar belakang (Kuning, Merah, # 000000);
- padding - padding di sekitar konten di dalam blok (0px, 20%);
- margin - margin eksternal dari blok (15px, 40%);
- perbatasan - bingkai (batas: hitam 0px solid;);
- float - perataan (kiri, kanan);
- radius batas - pembulatan sudut (radius batas: 10px;).
Langkah 2
Dalam penggunaan kedua CSS, tambahkan gaya antara tag dan:
.blok1 {
}
Dan tambahkan parameter yang Anda inginkan.
Langkah 3
Masukkan blok di tempat yang diinginkan di situs menggunakan perintah:
Blok 1
Simpan dan segarkan halaman, itu akan muncul. Ingatlah bahwa penyelarasan ketinggian dapat bervariasi tergantung pada seberapa penuh kontennya. Misalnya, jika Anda menetapkan 300px, tetapi hanya menulis satu baris teks, itu tidak akan ditampilkan secara penuh. Ini dapat diperbaiki, misalnya, menggunakan tabel dengan parameter yang diperlukan, yang harus ditempatkan di dalam blok, mis. antara tag dan. Dan agar batas tidak terlihat, masukkan atribut
