Kursus Membuat Web

iklan

Dimension CSS

Property dimension digunakan untuk mengontrol tinggi dan lebar dari elemen

Beberapa Contoh Untuk di Praktekkan Sendiri

img.normal {
	height: auto;
}
img.big {
	height: 120px;
}
p.ex {
	height: 100px;
	width: 100px;
}

Menentukan tinggi dari elemen

Contoh ini menunjukkan bagaimana mengatur tinggi yang berbeda dari elemen.

html, body {
    height: 100%;
}
img.normal {
    height: auto;
}
img.big {
    height: 10%;
}

Mengatur tinggi dari sebuah image menggunakan persen

Contoh ini menunjukkan bagaimana mengatur tinggi dari sebuah elemen menggunakan nilai persen.

img {
    width: 200px;
}

Menentukan lebar dari sebuah elemen menggunakan nilai pixel

Contoh ini menunjukkan bagaimana mengatur lebar elemen menggunakan nilai pixel.

p {
    max-height: 50px;
    background-color: yellow;
}

Menentukan tinggi maximum dari elemen

Contoh ini menunjukkan bagaimana mengatur tinggi maximum dari elemen.

p {
    max-width: 20%;
    background-color: yellow;
}

Menentukan lebar maximum dari elemen menggunakan persen

Contoh ini menunjukkan bagaimana mengatur lebar maximum dari elemen menggunakan nilai persen.

p {
    min-height: 100px;
    background-color: yellow;
}

Menentukan tinggi minimum dari elemen

Contoh ini menunjukkan bagaimana mengatur tinggi minimum dari elemen.

p {
    min-width: 150px;
    background-color: yellow;
}

Menentukan lebar minimum dari elemen menggunakan nilai pixel

Contoh ini menunjukkan bagaimana mengatur nilai lebar minimum dari elemen menggunakan nilai pixel.

Semua Property Dimension CSS

Property Keterangan Nilai
height mengatur tinggi dari elemen auto
length
%
inherit
max-height mengatur tinggi maximum dari elemen none
length
%
inherit
max-width mengatur lebar maximum dari elemen none
length
%
inherit
min-height mengatur tinggi minimum dari elemen length
%
inherit
min-width mengatur lebar minimum dari elemen length
%
inherit
width mengatur lebar dari elemen auto
length
%
inherit

Sebelumnya ...   Berikutnya ...

muhammad falah

Saya Muhammad Falah, jika Anda ingin langsung belajar dengan Saya, silakan ikuti kursus membuat web yang Saya bimbing atau ikuti Saya di :

Muhammad Falah Youtube Channel Muhammad Falah LinkedIn Muhammad Falah Google Plus Muhammad Falah Twitter Muhammad Falah Facebook

copy right © 2015