Home » bali media design » membuat tampilan website sederhana dengan html dan css

html adalah bahasa pemrograman inti untuk membuat halaman web, untuk membuat halaman web biasanya html dikombinasikan dengan script css agar tampilannya lebih dinamis dan mudah di edit. css adalah cascading style sheet dimana fungsinya untk mempercantik halaman web html. untuk contohnya adalah seperti berikut:

1. pertama kita ketik kodehtml berikut (copas juga bisa, hehe):

<!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>
<title>belajar membuat halaman web dengan html dan css</title>
</head>

<body>
<div>header</div>
<div>kiri</div>
<div>kanan</div>
<div>footer</div>
</body>
</html>

2. kemudian kita buat kode css nya seperti ini :

body {
height: auto;
width: 900px;
margin-top: 10px;
margin-right: auto;
margin-bottom: 10px;
margin-left: auto;
}
.header {
height: 220px;
width: 900px;
background-color: #003366;
}
.leftcol {
float: left;
height: auto;
width: 225px;
background-color: #333333;
}
.rightcol {
float: right;
height: auto;
width: 675px;
background-color: #9999FF;
}
.footer {
clear: both;
height: 30px;
width: 900px;
background-color: #000033;
}

kemudia taruh kode css tersebut dibawah kode ‘</head>’ dan diawal script tambahkan <script>, kemudia di akhir kode tambahkan tag script penutup ‘</script>’ , karena disini kita membuat css yang embeded dengan html artinya  kode css menyatu dengan kode htmlnya (css di halaman html).

sehingga kode lengkapnya seperti ini :

<!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>belajar membuat halaman web dengan html dan css</title>

<style type=”text/css”>
<!–
body {
height: auto;
width: 900px;
margin-top: 10px;
margin-right: auto;
margin-bottom: 10px;
margin-left: auto;
}
.header {
height: 220px;
width: 900px;
background-color: #003366;
}
.leftcol {
float: left;
height: auto;
width: 225px;
background-color: #333333;
}
.rightcol {
float: right;
height: auto;
width: 675px;
background-color: #9999FF;
}
.footer {
clear: both;
height: 30px;
width: 900px;
background-color: #000033;
}
–>
</style>
</head>

<body>
<div>header</div>
<div>kiri</div>
<div>kanan</div>
<div>footer</div>
</body>
</html>

Incoming search terms:

  • contoh script html keren
  • cara membuat html sederhana
  • membuat css script
  • membuat tampilan website
  • script html website keren
  • cara membuat website dengan css
  • cara membuat tampilan website
  • cara membuat web dengan css
  • contoh script html web design
  • yhs-fullyhosted_003
  • tampilan web sederhana
  • membuat website dengan html dan css
  • web html sederhana
  • cara membuat tampilan web dengan css
  • membuat tampilan html
  • contoh desain web sederhana
  • tampilan HTML
  • membuat tampilan web dengan css
  • script web sederhana
  • cara membuat css sederhana
  • cara membuat css pada html
  • web sederhana dengan html
  • membuat web sederhana dengan html
  • membuat tampilan web dengan php
  • membuat halaman web dengan css
  • syntak membuat web desain sederhana dengan php
  • contoh web sederhana dengan html dan css
  • membuat tampilan dengan css
  • membuat css sederhana
  • contoh desain web menggunakan html dan css
  • membuat tampilan layout website sederhana dengan html dan css
  • contoh desain html tentang pendidikan
  • cara membuat web sekolah menggunakan html dan css
  • contoh web template beserta kodingan nya
  • contoh website dan kode htmlnya
  • scrip css desain web sederhana
  • scrip html dan css website pariwisata
  • scrip web pariwisata
  • script tampilan di home web
  • tampilan awal website penjualan hp
  • web html dan css tempat wisata
  • web html sederhana penjualan kue
  • source code web site tentang pariwisata
  • kumpulan html footer terkeren
  • kumpulan design website keren beserta script html
  • contoh script html statis toko online
  • contoh script html sekolah simple
  • cara membuat tampilan pada webside
  • contoh html tentang pendidikan
  • contoh html dan css wisata
  • contoh desain web sekolah menggunakan html dan css
  • contoh desain web penjualan mudah
  • cara membuat web dinamis dengan html dan css
  • contoh coding membuat website dengan menggunakan html penjualan
  • codingan tampilan web keren
  • coding untuk tampilan beranda
  • cara membuat web wisata menggunakan html dan css
  • cara membuat desain website sekolah menggunakan bahasa tampilan html
  • contoh tampilan footer website tentang penjualan online
  • kodingan web resep makanan
  • koding web html dan css tempat wisata
  • kode script untuk tampilan web
  • download sintak website keren css
  • desain html css wisata
  • contohcoding website html css
  • cara membuat desain web pariwisata
  • contoh web wisata dengan codingan html dan css lengkap
  • contoh web statis pariwisata
  • contoh web jual beli menggunakan css dan html
  • contoh web html pendidikan
  • contoh web desain sederhana dan gampang
  • cara membuat web tempat wisata css
  • Leave a Reply

    Your email address will not be published. Required fields are marked *

    *
    *

    What is 3 + 5 ?
    Please leave these two fields as-is:
    IMPORTANT! To be able to proceed, you need to solve the following simple math (so we know that you are a human) :-)
    Google+ Plus Follow on Twitter Like On Facebook Email to us

    Latest

    cara menampilkan kode html dalam postingan
    Cara cek artikel yang sudah di index oleh mesin pencari google
    Cara disable pesan update notification di wordpress
    Cara Merubah URL Login WordPress
    menghapus watermark WonderPlugin Slider Free Version 4.3

    Recent Posts

    Visitor Counter