Dapatkan info terbaru via Facebook. Silahkan klik LIKE / SUKA.

Powered By Blogger Widgets and warungbelajar

Jumat, 25 November 2011

Bentuk Penulisan Css



Hai kawan kali ini , warung belajar akan membahas Bentuk penulisan Code Css , dimana Code Css bisa ditulis dengan beberapa bentuk, anda bisa menyesuaikan dengan pakai model mana anda menuliskan Script Cssnya
,Bentuk Penulisan Css antara lain :

1.External Style Sheet

External Style Sheet Adalah Cara penulisan Css yang memakai File External , jadi terdapat file yang terpisah dengan format exention .css yang dipanggil dalam file HTML , Script pemanggilan File Css ini diletakkan diantara code
<head></head>
Jadi contoh pemanggilannya adalah seperti ini:
<link href="mystyle.css" rel="stylesheet" type="text/css"></link>

Penjelasan :
Script ini memanggil file yang bernama mystyle.css yang berada dalam folder yang sama dengan file html tersebut

Contoh Pemakaian Script :

File Html

<html>
<head>
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>
<body>
<p>Ini contoh penggunaan css internal</p>
</body>
</html>

File Css

p {margin-left:20px;}
body {background-image:url("Lighthouse.jpg");}


Maka Hasilnya adalah




2.Internal Style Sheet

Internal Style Sheet ini digunakan untuk menuliskan code Script css pada halaman html tersebut , tanpa menggunakan file external , untuk penempatannya berada diantara code <head></head>

Untuk penulisan script diawali dengan :
<style type=”text/css”>
Dan diakhiri dengan </style>
Contoh pemakaian Script :

<html>
<head>
<style type="text/css">
#para1
{
text-align:center;
color:red;
}
.center
{
color:#0000FF;
}
</style>
</head>
<body>
<p id="para1">Hello World!</p>
<p class="">This paragraph is not affected by the style.</p>
</body>
</html>

Penjelasan : yang bagian Merah itu adalah Sebuah contoh pemakaian Css internal, jadi intinya css internal tidak membutuhkan file external , dan script dituliskan di html tersebut

Hasilnya :


3.Inline Style


Model penulisan css ini ,menuliskan secara langsung pada elemen html atau bisa dibilang style yang ada didalam tag dari sebuah dokumen , Css sendiri kan aslinya berada terpisah (Baik kondisi internal ataupun external),tapi terkadang untuk bagian tertentu dari tag kita membutuhkan style khusus , jadi bisa berikan style khusus tadi dengan memakai inline style
Berikut ini contoh Penggunaan inline Style :

<html>
<head>
<title>Untitled Document</title>
</head>
<body>
<p style="color:sienna;margin-left:20px">This is a paragraph.</p>
</body>
</html>


Penjelasan : 
Script ini memakai inline Style dimana :
<p style="color:sienna;margin-left:20px">This is a paragraph.</p>
Khusus untuk paragraf yang terkena style inline ini :
Warnanya : sienna
Lalu mendapatkan margin sebelah kanan 20px;

Hasilnya :


Ya seperti itu kawan Penjelasan Mengenai Bentuk Penulisan Css , hem anda bisa memilih sesuai dengan kebutuhan Code Css anda , Semoga bisa bermanfaat , Salam hangat selalu dari warungbelajar.com

Jika anda suka dengan artikel di blog ini.Silahkan berlangganan GRATIS via EMAIL.Isi alamat email anda di bawah ini

Masukkan Email anda disini:

Delivered by FeedBurner

Baca Artikel Menarik Lainnya Gan

0 komentar:

Poskan Komentar

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Best Buy Coupons