Belajar CSS Dasar Part 9 : Menggunakan Float CSS
Belajar CSS Menggunkan Fload CSS
Teknik Floating pada bagaian web desaign merupakan sebuah kebutukan yang paling banyak di perlukan .float berfungso untuk mengatur letak element secara horixontal . ada empat value yang bisa di gunakan untuk property float , yaitu left, right, inherit dan none.
salah satu contoh penggunaan float yang paling di temukan adalah ketika kita ingin membuat gambar postingan website yang terletak di bagian sampingan tulisan konten berikut akan di berikan contoh tentang penggunaan float pada css.
index.html
style.css
Refrensi
W3Schools.com
Teknik Floating pada bagaian web desaign merupakan sebuah kebutukan yang paling banyak di perlukan .float berfungso untuk mengatur letak element secara horixontal . ada empat value yang bisa di gunakan untuk property float , yaitu left, right, inherit dan none.
salah satu contoh penggunaan float yang paling di temukan adalah ketika kita ingin membuat gambar postingan website yang terletak di bagian sampingan tulisan konten berikut akan di berikan contoh tentang penggunaan float pada css.
index.html
<!DOCTYPE html>
<html>
<head>
<title>Border style CSS</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Lorem Ipsum</h1>
<div class="kotak">
<img class="gambar" src="http://www.extremetech.com/wp-content/uploads/2012/01/linux.jpg">
<p>
Lorem Ipsum adalah contoh teks atau dummy dalam industri percetakan dan penataan huruf atau typesetting. Lorem Ipsum telah menjadi standar contoh teks sejak tahun 1500an, saat seorang tukang cetak yang tidak dikenal mengambil sebuah kumpulan teks dan mengacaknya untuk menjadi sebuah buku contoh huruf. Ia tidak hanya bertahan selama 5 abad, tapi juga telah beralih ke penataan huruf elektronik, tanpa ada perubahan apapun. Ia mulai dipopulerkan pada tahun 1960 dengan diluncurkannya lembaran-lembaran Letraset yang menggunakan kalimat-kalimat dari Lorem Ipsum, dan seiring munculnya perangkat lunak Desktop Publishing seperti Aldus PageMaker juga memiliki versi Lorem Ipsum.Sudah merupakan fakta bahwa seorang pembaca akan terpengaruh oleh isi tulisan dari sebuah halaman saat ia melihat tata letaknya. Maksud penggunaan Lorem Ipsum adalah karena ia kurang lebih memiliki penyebaran huruf yang normal, ketimbang menggunakan kalimat seperti "Bagian isi disini, bagian isi disini", sehingga ia seolah menjadi naskah Inggris yang bisa dibaca. Banyak paket Desktop Publishing dan editor situs web yang kini menggunakan Lorem Ipsum sebagai contoh teks. Karenanya pencarian terhadap kalimat "Lorem Ipsum" akan berujung pada banyak situs web yang masih dalam tahap pengembangan. Berbagai versi juga telah berubah dari tahun ke tahun, kadang karena tidak sengaja, kadang karena disengaja (misalnya karena dimasukkan unsur humor atau semacamnya) Tidak seperti anggapan banyak orang, Lorem Ipsum bukanlah teks-teks yang diacak. Ia berakar dari sebuah naskah sastra latin klasik dari era 45 sebelum masehi, hingga bisa dipastikan usianya telah mencapai lebih dari 2000 tahun. Richard McClintock, seorang professor Bahasa Latin dari Hampden-Sidney College di Virginia, mencoba mencari makna salah satu kata latin yang dianggap paling tidak jelas, yakni consectetur, yang diambil dari salah satu bagian Lorem Ipsum. Setelah ia mencari maknanya di di literatur klasik, ia mendapatkan sebuah sumber yang tidak bisa diragukan. Lorem Ipsum berasal dari bagian 1.10.32 dan 1.10.33 dari naskah "de Finibus Bonorum et Malorum" (Sisi Ekstrim dari Kebaikan dan Kejahatan) karya Cicero, yang ditulis pada tahun 45 sebelum masehi. BUku ini adalah risalah dari teori etika yang sangat terkenal pada masa Renaissance. Baris pertama dari Lorem Ipsum, "Lorem ipsum dolor sit amet..", berasal dari sebuah baris di bagian 1.10.32.
</p>
</div>
</body>
</html>
style.css
h1{
text-align: center;
}
.gambar{
width: 300px;
float: left;
margin-right: 10px;
}
Refrensi
W3Schools.com
No comments