Kotak Keren Dengan CSS

Setelah sebelumnya kita membahas tentang cara membuat kolom di postingan juga tentang cara membuat kotak scroll keren kali ini Kolom Tutorial™  akan membahas tentang bagaimana membuat Kotak Keren Dengan CSS, Untuk langkah2 nya sebagai berikut :

<style type="text/css"> div.sundaboy1{border-style:solid; border-bottom-width:15px; border-color:blue;} </style> <div class="sundaboy1">Tulisan Sahabat Disini</div>


<style type="text/css"> div.atas { border-style:solid; border-top-width:20px; border-color:rgb(225, 225, 225);} </style> <div class="atas"> Tulisan Sahabat Disini</div>


<style type="text/css"> div.pinggir { border-style:solid; border-left-width:20px; border-color:#DF7401;} </style> <div class="pinggir"> Tulisan Sahabat Disini</div>


<style type="text/css"> div.sundaboy2{ border-style:solid; border-width:5px; border-color:red;} </style> <div class="sundaboy2"> Tulisan Sahabat Disini</div>


<style type="text/css"> div.dotted {border-style:dotted;} </style> <div class="dotted"> Tulisan Sahabat Disini</div>


<style type="text/css"> div.sundaboy2 {border-style: solid ;border-width: thin ;} </style> <div class="sundaboy2"> Tulisan Sahabat Disini</div>


<style type="text/css"> div.sundaboy3{ border-style:solid; border-width: thick ;} </style> <div class="sundaboy3"> Tulisan Sahabat Disini</div>


<style type="text/css"> div.sundaboy4{ border-style: solid ; border-width: medium ;} </style> <div class="sundaboy4"> Tulisan Sahabat Disini</div>


<style type="text/css"> div.outset {border-style:outset;} </style> <div class="outset"> Tulisan Sahabat Disini</div>


<style type="text/css"> div.outset {border-style:outset;} </style> <div class="outset"> Tulisan Sahabat Disini</div> <br /> <style type="text/css"> div.inset {border-style:inset;} </style> <div class="inset"> Tulisan Sahabat Disini</div>


<style type="text/css"> div.ridge {border-style:ridge;} </style> <div class="ridge"> Tulisan Sahabat Disini</div>


<style type="text/css"> div.groove {border-style:groove;} </style> <div class="groove"> Tulisan Sahabat Disini</div>


<style type="text/css"> div.double {border-style:double;} </style> <div class="double"> Tulisan Sahabat Disini</div>

Demikian postingan kali ini semoga dapat membantu para sobat blogger.

Berlangganan update artikel terbaru via email:

3 Responses to "Kotak Keren Dengan CSS"

  1. @MikiMaru:ok gan masama, thank kunjungannya, happy Blogging sob.

    ReplyDelete
  2. Ga ada demonya ya mas...btw, thanks udah sharing :)

    ReplyDelete

Terimakasih banyak atas kunjungannya, salam silatuhami Alexjoen

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel