GARIS TEPI

Garis tepi ialah warna tambahan di tiap bagian blog/website.Hampir semua halaman situs menggunakan garis tepi akan tetapi keberadaanya tidak terlalu diketahui.Namun apabila kita pandai menghias blog maka fungsi garis tepi ini sangat-sangat dibutuhkan.Dibawah ini contohnya.

JUDUL                                      


Blogvagansa.Harian online memuat berita berita blog serta mengandungi tips-tips blog.

JUDUL                                      


Blogvagansa.Harian online memuat berita berita blog serta mengandungi tips-tips blog.

JUDUL                                      


Blogvagansa.Harian online memuat berita berita blog serta mengandungi tips-tips blog.

JUDUL                                      


Blogvagansa.Harian online memuat berita berita blog serta mengandungi tips-tips blog.

JUDUL                                      


Blogvagansa.Harian online memuat berita berita blog serta mengandungi tips-tips blog.

JUDUL                                      


Blogvagansa.Harian online memuat berita berita blog serta mengandungi tips-tips blog.

JUDUL                                      


Blogvagansa.Harian online memuat berita berita blog serta mengandungi tips-tips blog.

JUDUL                                      


Blogvagansa.Harian online memuat berita berita blog serta mengandungi tips-tips blog.

JUDUL                                      


Blogvagansa.Harian online memuat berita berita blog serta mengandungi tips-tips blog.

JUDUL                                      


Blogvagansa.Harian online memuat berita berita blog serta mengandungi tips-tips blog.

Yang pertama ialah box tanpa garis tepi dan berikut berikutnya box widget yang dihiasi dengan garis tepi.Untuk membuatnya ada dua cara,pertama membuat secara permanent yang apabila kita menambahkan sesuatu dalam widget/gadget maka secara automatic gadget yang dibuas sudah memiliki garis tepi yang diingini.Caranya ialah.

1.Dasbor -->>design-->>Edit html

2.Temukan kod yang akan diberi garis tepi,misalkan widget content (widget content ialah kod permanent dalam blog)

3.tambahkan kod garis tepi didalamnya

4.Save

Cara kedua lebih mudah namun ianya bersifat manual akan tetapi cara ini dapat membuat garis tepi yang berbeda beda di tiap widget content.Ikuti instruksi dibawah ini.

1.

<div style="background-color: white; height: auto; padding: 10px; text-align: left; ">

disini isinya

</div>

2.


<div style="background-color: white; border: 1px solid red; height: auto; padding: 10px; text-align: left; width: 200px;">
disini isinya
</div>


3.


<div style="background-color: white; border: 4px double red; height: auto; padding: 10px; text-align: left; width: 200px;">
disini
</div>

4.


<div style="background-color: white; border: 1px dotted red; height: auto; padding: 10px; text-align: left; width: 200px;">
disini
</div>



5.


<div style="background-color: white; border: 1px dashed red; height: auto; padding: 10px; text-align: left; width: 200px;">
disini
</div>

6.

<div style="background-color: white; border: 10px outset red; height: auto; padding: 10px; text-align: left; width: 200px;">
disini
</div>

7.


<div style="background-color: white; border: 10px inset red; height: auto; padding: 10px; text-align: left; width: 200px;">
disini
</div>

8.


<div style="background:red;margin-bottom: 10px; border: 1px solid #c0c0c0;width:200px; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;">
disini
</div>

9.


<div style="background-color: white; border: 1px dotted red; height: auto; padding: 10px; text-align: left; width: 200px;-moz-border-radius-topleft: 10px;-moz-border-radius-bottomright: 10px;-moz-border-radius-topright: 40px;-moz-border-radius-bottomleft: 40px;
-webkit-border-top-left-radius: 10px;-webkit-border-top-right-radius: 40px;-webkit-border-bottom-left-radius: 40px;-webkit-border-bottom-right-radius: 10px;border-top-left-radius: 10px;border-top-right-radius: 40px;border-bottom-left-radius: 40px;border-bottom-right-radius: 10px;">
disini
</div>

10.


<div style="-moz-box-shadow: 0 0 5px 5px #888; -webkit-box-shadow: 0 0 5px 5px#888; background-color: white; border: 1px solid red; box-shadow: 0 0 5px 5px #888; height: auto; padding: 10px; text-align: left; width: 200px;">
disini
</div>


Warna dan garis tepi dapat dirubah rubah (red,white,black,etc)