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
  • yhs-fullyhosted_003
  • contoh script html web design
  • tampilan web sederhana
  • membuat website dengan html dan css
  • web html sederhana
  • cara membuat tampilan web dengan css
  • membuat tampilan html
  • tampilan HTML
  • contoh desain web sederhana
  • membuat tampilan web dengan css
  • cara membuat css sederhana
  • script web sederhana
  • cara membuat css pada html
  • web sederhana dengan html
  • membuat tampilan web dengan php
  • syntak membuat web desain sederhana dengan php
  • membuat halaman web dengan css
  • membuat web sederhana dengan html
  • membuat css sederhana
  • contoh web sederhana dengan html dan css
  • membuat tampilan dengan css
  • contoh desain web menggunakan html dan css
  • skrip desain web sekolah
  • cara membuat web statis dengan html dan css
  • membuat web statis dengan html dan css
  • scrip html pariwisata
  • contoh website html beserta codingnya
  • contoh web tema seting pariwisata
  • Tampilan yang menarik di web menggunakan mode pewarnaan
  • tuliskan script css dan html untuk membuat untuk membuat website
  • membuat tampilan html bagus
  • sintak membuat tampilan wwbsite
  • contoh skrip html membuat blog kampus
  • membuat skrip html dan css sederhana
  • membuat halaman web dinamis menggunakan html dan css
  • tutorial cara membuat penjualan motor di html dan css
  • web penjualan dengan script html
  • script html bagus mudah
  • tampilan website penjualan
  • tampilan website menarik beserta codingnya
  • script untuk membuat web pariwisata
  • Script layout html dan css sederhana
  • skcrip tampilan web bagus
  • script html desain web sekolah
  • skrip html membuat website dengan tema bebas
  • syntx html tampilan google
  • tampilan login sederhana web
  • tampilan web menarik beserta codingnya
  • script di php untuk tampilan beranda yang keren
  • scrip untuk membuat html dan ccs untuk membuat web yg mudah dan menarik
  • tampilan web statis dengan caranya
  • web penjualan sederhana html dan css
  • bikin template di html dan css beserta artinya
  • contih web sekolah beserta scrip hyml
  • contoh coding html sederhana
  • contoh coding template sederhana
  • contoh coding untuk membuat tampilan web
  • contoh coding web html
  • contoh css sederhana desai web
  • contoh desain layout html
  • contoh desain web html dan css
  • contoh design web sederhana menggunakan css htm
  • codingan website profil sekolah mengunakan css dan html
  • Codingan website pariwisata
  • cara buat tampilan home dgn css
  • cara membuat html websait pendidikan
  • cara membuat program html template wisata
  • cara membuat tampilan depan website beserta menu
  • cara membuat tampilan untuk pengunjung web penjualanan menggunakan php coder
  • cara membuat tampilan website sederhana
  • cara membuat web dgn css profil sekolah
  • code desain web sederhana dengan html dan css
  • coding html lengkap
  • contoh listing bahasa pemrograman php dan penjelasan listingnya
  • contoh program jual beli html keren
  • contoh web sederhana menggunakan css
  • contoh web sekolah beserta coding html lengkap
  • contoh web sekolah dengan css
  • contoh website dengan tampilan yang menarik dan coding nya
  • desain web dan script
  • desain web sekolah html css
  • download script html desain web keren
  • download web sekolah dgnhtml dan css
  • judul web dinamis yang mudah dibuat
  • contoh web html sederhana penjualan
  • contoh web html beserta codingnya
  • contoh script css sederhana
  • contoh script css untuk pembuatan website
  • contoh script html dan css
  • contoh script tampilan Blog menggukan css
  • Contoh tampilan script web
  • contoh tampilan web penjualan sederhana
  • contoh tampilan web yang menarik beserta codenya
  • contoh web css bersama listingnya
  • contoh web design pariwisata
  • kode web bagus
  • Leave a Reply

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

    *
    *

    What is 11 + 2 ?
    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