Langsung ke konten utama

perbedaan div dan class barlianno.

perbedaan div dan class barlianno.

perbedaan antara lain:
dalam penulisan css div diawali dengan(#) sedankan class di awali dengan titik (.)

contoh penulisan div dan class.
.semua_kotak1 {font-family:tahoma, verdana; font-size:24px; color:red;}/*ini adalah class*/
#halaman{ width:980px; margin:0 auto;  background-color:#03438D; /*ini adalah div*/

setiap class bisa di masukan pada div sesuai dengan keinginan kita.untuk lebih jelas kita coba langgsung praktek.
buat 2 fail di satu polder yang di beri nama index.html dan style.css

style.css
===========================================
@charset "utp-8";
/**/
.semua_kotak1 {font-family:tahoma, verdana; font-size:24px; color:red;}/*ini adalah class*/
.semua_kotak2 {font-family:tahoma, verdana; font-size:18px; color:blue;}/*ini adalah class*/

#halaman{
 width:980px;
 margin:0 auto;
  background-color:#03438D;/*warna biru*/
 }   
#header {
 height: 80px;
 padding:10px;
 background-color:#CCCCCC;
 }  
#kiri{
 height:400px;
 padding:10px;background-color:#CCCCCC;
 float:left;
 width:250px;
 margin-top:10px;
border-radius : 10px;
 }  
#kanan {
 height:400px;
 padding:10px;
 background-color:#33FF33;
 float:right;width:250px;
 margin-top:10px;
 }  
#tengah {
 height:400px;
 padding:10px;background-color:#CCCCCC;
 margin:10px 290px 0 290px;
 }  
#footer { clear:both; height:40px;padding:10px; background-color:#CCCCCC; margin-top:10px;}
=======================================
index.html
=======================================
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Layout 3 kolom dengan css barlianno </title>
<link rel='stylesheet' type='text/css' href='style.css'/>

   </head>
 
   <body>
     <div id="halaman">
   <div id="header">
   HEADER
   </div>
   <div id="kiri"class="semua_kotak1">
  isi  KIRI
  <br> height:400px;
 padding:10px;
 background-color:#CCCCCC;
 float:left;
 width:250px;
 margin-top:10px;
border-radius : 10px;
 pakai class "class="semua_kotak1"
   </div>
   <div id="kanan">
   isi KANAN
   <br>
   height:400px;
 padding:10px;
 background-color:#33FF33;
 float:right;width:250px;
 margin-top:10px;
 tanpa class
   </div>
   <div id="tengah"class="semua_kotak2">
   isi TENGAH
   <br>
   height:400px;
 padding:10px;
 background-color:#CCCCCC;
 margin:10px 290px 0 290px;
 pakai class "class="semua_kotak2"
   </div>
  
   <div id="footer">
 
   FOOTER
   </div>

  
   </div>
   </body>
   </html>
==========================================
hasil
==========================================
keterangan gambar:
pada isi kiri muncul warna tek merah karna menggunakan  class semua_kotak1
pada isi tengah muncul warana biru karna menngunakan class semua_kotak2
pada isi kanan muncul warna tek yang belum di seting pakai class.




cara memasukan di html

semoga bermangfaat
telah di uji coba di lab barlianno.

Komentar

Posting Komentar

Postingan populer dari blog ini

agar phpmyadmin bisa di akses dari luar

Setting local server XAMPP agar bisa di panggil dari komputer lain dalam jaringan katika akan membuat aplikasi client server dengan mengandalkan localserver XAMPP hal yang apling penting yaitu XAMPP pada komputer server dapat dipanggil dari komputer client. Agar XAMPP komputer server dapat dipanggil maka perlu kita lakukan pengaturan sebagai berikut: Buka file httpd.conf   di folder C:\xampp\apache\conf , ggunakan notepad atau notepad++ untuk lebih mudahnya Cari tulisan LoadModule vhost_alias_module modules/mod_vhost_alias.so  dan hilangkan tanda pagar (#) didepannya. Cari tulisan Include "conf/extra/httpd-vhosts.conf" apabila didepanya masih ada tanda # hilangkan tanda tersebut. Selanjutnya kita perlu mengatur siapa saja yang dapat mengakses XAMPP pada komputer server, langkah-langkahnya seperti berikut. Buka file httpd-xampp.conf di C:\xampp\apache\conf\extra . Dibagian paling bawah terdapat tulisan seperti berikut view plain print ?...
2 komentar
Baca selengkapnya

cara pasang jarum dot matrix lq 2180

memasang jarum 24 pin dotmatrik merupakan hal yang paling sulit, dan memerlukan kesabaran, apalagi jika kita tidak mengetahui urutan pemasangan jarum nya. di bawah ini saya akan mencoba memasang jarum serta tahapan tahapannya. kunci dari pemasangan terletak pada pemasangan jarum pendek. kita harus memastikan jarum pendek terpasang secara sempurna pada titik lobang yang telah ditentukan.kita harus memasang jarum pendek dari urutan pertama dan meloncati satu lobang untuk nantinya dipasang jarum panjang.kalow pemasangan jarum pendek tidak terpasang dengan sempurna maka pada waktu pemasangan jarum panjang akan susah masuk. dan harus di ulang dari awal capepee dehhh.   gambar di atas memperlihatkan tahap pemasangan jarum pendek sampai ke jarum panjang. setelah pemasangan jarum selesai dan head sdiap di coba . selamat mencoba telah di uji di lab barlianno. http://www.sewadpc.com/
9 komentar
Baca selengkapnya

Dioda seri dan pararer

Penngantian Dioda seri dan pararer. Ketika berbicara tentang spesifikasi dioda, satu selalu mengacu pada puncak tegangan terbalik (PRV) dan ampere (A). bila teganggan puncuk tercapai maka dioda akan putus atow short. dibawah ini adalah perhitungan dioda di hubungkan secara seri dan pararel : dioda 400 V 2 A dihubungkan seri = 800 V 2 A. dioda 400 V 2 A dihubungkan paraler = 400 V 4 A. untuk membuat dioda bertahan lebih lama Anda harus menghubungkan resistor dan kapasitor dan tempat di setiap dioda untuk menyamakan tetes PRV dan menjaga terhadap tegangan transien. Add caption untuk mencari nilai resistor, sebagai aturan praktis, kalikan rating PRV dari dioda oleh 500 ohm. Sebagai contoh, sebuah dioda 800 PRV harus didorong oleh 800 X 500 sama dengan 400.000 ohm. Adapun nilai kapasitor, gunakan 0,01 microfarad kapasitor disk keramik terhubung di setiap dioda. penggantian dioda biasa ya di lakukan ada ssat mennganti dioda damer hori jontal. karna biasanya ada d...
2 komentar
Baca selengkapnya