22 Jan 2010

MODIFIKASI HEADER BLOG

 Cobalah yang ini sobat... memodifikasi header blog... bisa di ganti dengan fotomu atau terserah sesukamu..
Ubahlah ukuran header sesuai keinginan mu..
 Selamat Mencoba




Modifikasi/mengubah lebar header blog:

    * cari kode CSS berikut:

      #header-wrapper {
      width:660px;
      margin:0 auto 10px;
      border:1px solid $bordercolor;
      }
    * ubah nilai property width. (semakin tinggi nilainya maka header akan semakin lebar)


Modifikasi/mengubah tinggi header blog:

    * cari kode CSS berikut:

      #header-wrapper {
      width:660px;
      margin:0 auto 10px;
      border:1px solid $bordercolor;
      }
    * tambahkan kode berikut diantara tanda { dan }:

      height:100px;

      Anda dapat menentukan nilainya sesuai keinginan anda. (semakin tinggi nilainya maka header akan semakin tinggi). Contoh:

      #header-wrapper {
      width:660px;
      height:100px;
      margin:0 auto 10px;
      border:1px solid $bordercolor;
      }


Modifikasi/mengubah background header blog:

Cara mengubah warna background header:

    * cari kode CSS berikut:

      #header-wrapper {
      width:660px;
      margin:0 auto 10px;
      border:1px solid $bordercolor;
      }
    * tambahkan kode CSS property: background. Anda dapat mengisi properti background dengan warna atau gambar. contoh:

      background: #000000 url(http://hosting.com/filegambar.gif) no-repeat top center;

      penjelasan:

          o #000000 = background berwarna hitam
          o url(http://hosting.com/filegambar.gif) = lokasi background gambar
          o no-repeat top center = background gambar tidak diulang / tampil 1 gambar, posisinya dimulai dari atas dan di tengah


Modifikasi/mengubah border header blog:

    * cari kode CSS berikut:

      #header-wrapper {
      width:660px;
      margin:0 auto 10px;
      border:1px solid $bordercolor;
      }
    * ubah nilai property border.
          o 1px = tebal border, dapat anda ubah menjadi 2px, 3px atau yang lainnya
          o solid = style border padat, anda dapat merubahnya dengan style border lainnya: dotted, dashed, double, groove, ridge, inset, atau outset
          o border:1px solid $bordercolor = warna border yang disesuaikan dengan variabel warna border, anda dapat merubahnya melalui menu Lay Out > Font and Color atau anda dapat mengisinya dengan kode warna html.
    * Contoh:
      #header-wrapper {
      width:660px;
      margin:0 auto 10px;
      border:2px inset #98bf21;
      }

No comments :