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 web dengan css
  • cara membuat tampilan website
  • contoh script html web design
  • yhs-fullyhosted_003
  • tampilan web sederhana
  • membuat tampilan html
  • membuat website dengan html dan css
  • web html sederhana
  • cara membuat tampilan web dengan css
  • tampilan HTML
  • contoh desain web sederhana
  • membuat tampilan web dengan css
  • script web sederhana
  • cara membuat css sederhana
  • web sederhana dengan html
  • cara membuat css pada html
  • membuat tampilan web dengan php
  • membuat halaman web dengan css
  • syntak membuat web desain sederhana dengan php
  • membuat web sederhana dengan html
  • contoh web sederhana dengan html dan css
  • membuat tampilan dengan css
  • membuat css sederhana
  • contoh desain web menggunakan html dan css
  • skrip desain web sekolah
  • cara membuat web statis dengan html dan css
  • membuat tampilan layout website sederhana dengan html dan css
  • contoh web wisata dengan codingan html dan css lengkap
  • kumpulan design website keren beserta script html
  • kode web bagus
  • kode tampilan web html
  • kode script untuk tampilan web
  • download sintak website keren css
  • web penjualan sederhana html dan css
  • desain web sekolah html css
  • desain html css wisata
  • contohcoding website html css
  • download script html desain web keren
  • web penjualan dengan script html
  • membuat desain website sekolah dengan html
  • scrip untuk membuat html dan ccs untuk membuat web yg mudah dan menarik
  • scrip web pariwisata
  • script html bagus mudah
  • cara membuat web dgn css profil sekolah
  • membuat tampilan html bagus
  • script html desain web sekolah
  • script tampilan di home web
  • sintak membuat tampilan wwbsite
  • skrip html membuat website dengan tema bebas
  • tampilan awal website penjualan hp
  • contoh web template beserta kodingan nya
  • contoh web statis penjualan
  • 10 script html keren dan mudah
  • codingan website profil sekolah mengunakan css dan html
  • contoh coding desain Web menggunakan html
  • contoh coding html jualan
  • contoh coding template sederhana
  • contoh coding web sekolah
  • contoh desain layout html
  • contoh desain web html dan css
  • contoh desain web paling sederhana tema education
  • codingan tampilan web keren
  • coding untuk tampilan beranda
  • coding html web sekolah
  • cara membuat desain website sekolah menggunakan bahasa tampilan html
  • cara membuat desain website sekolah menggunakan html dan css
  • cara membuat skrip website sederhana
  • cara membuat tampilan pada webside
  • cara membuat web design beserta kodenya
  • cara membuat web sekolah menggunakan html dan css
  • cara membuat web tempat wisata css
  • cara membuat web wisata menggunakan html dan css
  • contoh desain web penjualan mudah
  • contoh desain web sekolah menggunakan html dan css
  • contoh design web sederhana menggunakan css htm
  • contoh tampilan web penjualan sederhana
  • contoh tampilan web yang menarik beserta codenya
  • Contoh web atau blog menggunakan css dan html beserta hasilnya
  • contoh web beserta coding html dan css
  • contoh web desain sederhana dan gampang
  • contoh web html pendidikan
  • contoh web html sederhana penjualan
  • contoh web jual beli menggunakan css dan html
  • contoh tampilan web dinamis beserta css nya
  • contoh tampilan web dinamis
  • contoh tampilan web dan dintak dengan dropdown
  • contoh html dan css wisata
  • contoh html tentang pendidikan
  • contoh listing bahasa pemrograman php dan penjelasan listingnya
  • contoh membuat index html wisata kuliner
  • contoh script css untuk pembuatan website
  • contoh script html dan css
  • contoh syntax login yang keren dengan html
  • contoh tampilan footer website tentang penjualan online
  • contoh web sekolah html sederhana
  • Leave a Reply

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

    *
    *

    What is 3 + 6 ?
    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