Cara Menggunakan CSS Pada HTML


Cara Menggunakan CSS Pada HTML 

Cara menggunakan CSS pada HTML sebagai berikut :

  1. Sebelum Anda Menggunakan CSS anda Harus Mengetahui Apa CSS itu ?
  2. Fungsi CSS APA ?
  3. Bagaimana Memasang CSS dengan HTML ?

CSS atau bisa di singkat dengan Cascading Style Sheets yang merupakan bahasa pemrograman dalam membuat desain sebuat situs Blog maupun Web.
CSS tidak hanya Bisa Di gunakan Di HTML Saja,
CSS Bisa Kompitabel dengan Berbagai Jenis Bahasa Pemrograman yang tentunya menyangkut tentang Website atau pun Blog.
Banyak yang tanya Bahasa Pemrograman itu apa ?
Jika kita mau membuat sebuah CSS tapi tida mengerti apa itu Bahasa Pemrograman pasti hasil akan kurang maksimal atau hanya setengah - setengah saja.

Oke akan saya jelaskan sedikit saja ya tentang bahasa pemrograman, untuk pengertian banyaknya silahkan bisa anda baca pada kategory bahasa pemrograman pada blog ini.

Oke Pada posting ini tentang HTML, Bahasa pemrograman disini berarti HTML,
sebagai Contoh websitku.html atau website.php

dengan file yang mempunyai nama.html atau .php itu namanya bahasa pemrograman.

jika disitu sudah mengerti kita lanjutke berikutnya.

Fungsi CSS ?

Sudah Pasti Fungsi CSS sebagai desain dengan nama Cascading Style Sheets dengan arti dari Style yang arti suatu tampilan.

Namun Perlu di ingat, CSS tidak dapat berdiri sendiri harus ada kode atau source code lainnya dalam menampilkan CSS tersebut ?

maksudnya bagaimana ?

disini kita akan tahu bagaimana memasang CSS atau menggunakan CSS ?

ok, kita harus tahu Contoh CSS dulu baru tahu gambaran tentang CSS,
Contoh CSS sebagai berikut :

/* CSS Document */
body {
    margin:0;
    padding:0;
    background-color:#EEF2EF;
    color:#000;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    }
#wrapper {
    width: 980px;
    margin:0 auto;
    background-repeat:no-repeat;
    background-color: #FF9933;
    border-left: #594431 solid 1px;
    border-right: #594431 solid 1px;
}

 dan kita akan simpan dengan nama Style.css

nah seperti itulah contoh CSS,

Penyimpanan CSS pun filenya bukan HTML, tapi nama.CSS

Terus CSS mempunyai nama sendiri apa bahasa pemrograman, menurut saya si tidak,, karena tidak bisa berdiri sendiri atau tampil jika tidak di kompitable dengan lainnya.

setelah tahu gambaran CSS, selanjutnya kita terapkan CSS :

Contoh sebuah desain HTML

<!DOCTYPE html>
<html>
<head>

<link rel="stylesheet" type="text/css" href="style.css"/>

<style type="text/css">
  
Isi CSS
    
   </style>
</head>
 
<body>


<div id="wrapper">


<div id="header">
              <H1>Menu Wrapper</H1>
</div>
              <ul id="nav">
    <li><a href="index.php">Home</a></li>
    <li><a href="menu.php">Menu</a></li>
    <li><a href="about.php">About</a></li>
    <li><a href="contact.php">contact</a></li>
    <li><a href="sosial.php">Sosial Media</a></li>
  </ul>
   
</body>
</html>

 Keterangan :

div id="wrapper"

Memanggil sebuah CSS dengan Nama Wrepper

dan CSS yang terpanggil

#wrapper {
    width: 980px;
    margin:0 auto;
    background-repeat:no-repeat;
    background-color: #FF9933;
    border-left: #594431 solid 1px;
    border-right: #594431 solid 1px;
}

dan CSS tersebut diterapkan pada sebuah menu Wrapper dengan Source Code :

<div id="header">
              <H1>Menu Wrapper</H1>
</div>
              <ul id="nav">
    <li><a href="index.php">Home</a></li>
    <li><a href="menu.php">Menu</a></li>
    <li><a href="about.php">About</a></li>
    <li><a href="contact.php">contact</a></li>
    <li><a href="sosial.php">Sosial Media</a></li>
  </ul>

dan jika ditampilkan dalam sebuah Web atau blog :

Sebagai Contoh :


Seperti Itulah Gambaran Tetang CSS,,

Semoga dapat Bermanfaat

Good Luck.

Subscribe to receive free email updates:

0 Response to "Cara Menggunakan CSS Pada HTML "

Post a Comment