/* Blog untuk Penggemar Gratis dan Free: CSS Outline*/


Tuesday, May 19, 2009

CSS Outline

Properti ini digunakan untuk membuat garis untuk mengelilingi sebuah elemen. Kalau dibarengi dengan border, maka outline ini akan terletak diluar garis border.
Sayangnya properti outline tidak bisa ditampilkan dalam browser IE.
bagi pemakai IE boleh tidur dulu....
Sintak dan Contoh pemakaian :
Seperti halnya border, outline mempunya tiga macam value (outline-width, outline-style dan outline-color) yang bisa deklarasikan sekaligus.

p
{
border: medium solid red
}


Contohnya borongan aja yaa (kasihan fans IE kelamaan nunggunya..)

<html>
<head>
<style type="text/css">
p
{
border: red solid thin;
}
p.dotted {outline-style: dotted}
p.dashed {outline-style: dashed}
p.solid {outline-style: solid}
p.double {outline-style: double}
p.groove {outline-style: groove}
p.ridge {outline-style: ridge}
p.inset {outline-style: inset}
p.outset {outline-style: outset}
</style>
</head>
<body>

<p class="dotted">A dotted outline</p>

<p class="dashed">A dashed outline</p>

<p class="solid">A solid outline</p>

<p class="double">A double outline</p>

<p class="groove">A groove outline</p>

<p class="ridge">A ridge outline</p>

<p class="inset">An inset outline</p>

<p class="outset">An outset outline</p>
</body>
</html>

Sorry yaa, contohnya hanya outline-style aja..., outline-width dan outline-color nya bisa dicoba sendiri..

Tampilan:

A dotted outline



A dashed outline



A solid outline



A double outline



A groove outline



A ridge outline



An inset outline



An outset outline




Dah..cukup dulu yaa, pemakai IE jangan heran kalau outline nya kagak kelihatan, bukannya mata anda yang error tapi emang IE yang pelit kaga mau nampilin... Untuk Opera ada beberapa jenis outline yang ditampilin sama...

No comments:

Post a Comment