Judul : Belajar Height CSS. Tujuan : Mempelajari cara menggunakan height pada CSS untuk mengatur tinggi. Target : Dapat memahami struktur dari pemrograman CSS.
Setelah mempelajari Penulisan CSS pada sesi sebelumnya, sekarang kita akan mempelajari mengenai Height pada CSS. Height pada CSS di bagi menjadi 3 bagian utuh yaitu max-height, min-height, dan height itu sendiri. Fungsinya terurut adalah untuk menentukan tinggi maksimal, tinggi minimal dan tinggi. Pada penggunaan height biasanya akan diikuti oleh width yang berguna untuk menentukan lebar pada tampilan. Untuk Width CSS akan dibahas pada sesi setelah ini.
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#tinggi_min{
min-height: 100px;
width: 300px;
background:red;
}
#tinggi_max {
max-height: 100px;
width: 300px;
background:red;
}
#tinggi{
height: 200px;
width: 300px;
background: red;
}
</style>
<title>Height</title>
</head>
<body>
<p id="tinggi_min"><b>CONTOH MIN HEIGHT</b>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
<p id="tinggi_max"><b>CONTOH MAX HEIGHT</b>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<p id="tinggi"><b>CONTOH HEIGHT</b>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</body>
</html>
EmoticonEmoticon