Pages

mempelajari lebar dan tinggi elemen

Hai Teman-teman ,masih bingung yah untuk mengerjakannya lebar dan tinggi elemen pada tata letak, di sini saya akan menjelaskannya, jika anda masih pada posisi blog saya dan terus mengikuti pembuatan template dari awal sampai akhir. maka anda akan bergabung di dalam artikel ini. 




tetapi jika anda mengunakan blog saya sebagai pelajaran untuk membuat blog anda bisa mempelajarinya di sini agar dapat lebih detail dan membedakan suatu ukuran lebar dan tinggi eleman.

pada sebuah tata letak terdiri dari 

1. Margin (batas)> Menghapus daerah di luar perbatasan. Margin transparan

Margin Adalah jarak yang memisahkan antara border dan sisi luarnya. yaitu margin sebelah atas, kanan, bawah dan kiri. jika anda masih sangat bingung silahkan anda ke sini untuk melihat ulang kembali untuk mengunakan margin anda dapat isinya secara langsung dengan contoh berikut :

margin 5px 
atau
margin-top:5px     ---->        ( Atas )
margin-right:6px   ---->        kanan )
margin-bottom:7px    --->   ( Bawah )
margin-left:8px      ---->       ( Kiri )

2. Padding (lapisan)> Menghapus sebuah daerah di sekitar konten. Padding transparan
padding adalah jarak antara border dengan bagian komponen body. 
padding anda dapat mengikuti caranya seperti contoh

padding 5px 
atau
padding-top:5px     ---->        ( Atas )
padding-right:6px   ---->        kanan )
padding-bottom:7px    --->   ( Bawah )
padding-left:8px      ---->       ( Kiri )

3. Conten > Isi kotak, di mana teks dan gambar muncul
conten adalah isi teks posting,laman,gambar dan lain-lain, 

4. Border > Sebuah batas yang terjadi di sekitar padding dan konten

border adalah sebuah garis paling luar yang merupakan bingkai dalam sebuah postingan atau widget di blog, border umumnya merupakan urutan ukuran border, jenis dan warna border. contohnya seperti ini border:10px solid #000; penjelasanya seperti ini Ukuran Border 10px, Jenis border solid, Warna border hitam.

Jenis-jenis Border

1. None ( tidak ada sama sekali atau kosong )
2. Dotted ( Titik di dalam border )
3. Dashed ( garis putu-putus )
4. solid ( garis tebal hitam )
5. double ( garis dobel )
6. dot-dash ( garis dan titik )
7. groove ( garis putih yang di keliling dengan oleh garis hitam di luar pading)
8. ridge ( garis hitam yang di kelilingi oleh garis putih di dalamnya )
9. inset ( border nampak seperti di tekan )
10. outset ( nampak menonjol atau keluar )
11. wave ( garis yang bergelombang )
12. dot-dot-dash ( garis dengan 2 titik )

saya sudah contohkan pada kode css di part 5


itu adalah pengenalan mengenai lebar dan tinggi elemen, bagaimana apakah sudah paham mengenai ini, saya akan selalu membedakan dengan suatu perbandingan pada px dimana akan saya lebih besar dan kecil agar dapat membedakannya.

Dalam hal ini ada yang sangat penting untuk di ingat, Bila Anda mengatur lebar dan tinggi sifat elemen dengan CSS, Anda hanya mengatur lebar dan tinggi area konten. Untuk menghitung ukuran penuh elemen, Anda juga harus menambahkan padding, perbatasan dan margin

semoga bermanfaat. 

No comments :

Post a Comment