Tour yang ada di halaman ini terinspirasi dari sebuah blog luar Learn CSS Layout yang menjelaskan secara singkat tentang property yang ada di dalam CSS

Advertisement

Dimulai dari property ‘display’

property display

Display sendiri dalam bahasa saya artinya adalah cara menampilkan. Value (nilai) dari property display ada cukup banyak, namun hanya ada 2 saja yang paling umum dan sering ditemui dalam kode CSS yaitu display block dan inline.

display block menampilkan full dari ujung kiri ke ujung kanan (istilahnya nge-block alias menguasai)
display inline menampilkan bisa diantara yang lainnya (diselipkan ditengah-tengah)

Contoh

<p>
Paragraf ini menggunakan display block sehingga isinya penuh dari sisi kiri ke sisi kanan, nah sementara di dalam paragraf ini kita bisa menyisipkan sebuah text-lain dengan <span style=”display: inline;”>display inline</span> sehingga ia bisa berdiri diantara (diselipkan) text lainnya
</p>

Preview

Paragraf ini menggunakan display block sehingga isinya penuh dari sisi kiri ke sisi kanan, nah sementara di dalam paragraf ini kita bisa menyisipkan sebuah text-lain dengan display inline sehingga ia bisa berdiri diantara (diselipkan) text lainnya

Akan menjadi berbeda jika kode span diberi display block, maka hasilnya akan menjadi seperti berikut ini

Preview

Paragraf ini menggunakan display block sehingga isinya penuh dari sisi kiri ke sisi kanan, nah sementara di dalam paragraf ini kita bisa menyisipkan sebuah text-lain dengan display block sehingga ia akan memenuhi ruangan dari sisi kiri sampai kanan

Next postProperty "Margin" Dalam CSS