CSS Outline ~ TRIK TRIK INTERNET

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...

These icons link to social bookmarking sites where readers can share and discover new web pages.