Cara memodifikasi border dash template contempo melalui pengaturan CSS

Jangan remehkan peranan border-dash pada desain tema, itu bukan hanya sekedar garis pembatas. Akan tetapi jika kita sedikit saja kreatif, border dash yang nampak biasa biasa itu mampu membuat sebuah desain menjadi sangat menarik perhatian! Perhatikan gambar delapan bentuk dan jenis border dash yang dapat kita modifikasi dibawah ini.

border dash blogger

Jika dibanding dengan jenis template lama dan klasik, susunan CSS pada tema blogger contempo itu sedikit berbeda, lebih banyak dan lebih komplit. Tidak heran juga sih kalau ke empat varian terbaru template bawaan blogger jika disebut sebagai template CSS.

Gambar diatas adalah jenis border dash yang bisa kita modifikasi: ketebalan, warna dan lengkungannya pada tema contempo. Sedangkan pada contempo Hybrid versi gradient yang sedang di pakai oleh editblogtema, kami menggunakan border dash "double" untuk menghiasi bagian atas kolom komentar.

Baiklah kita mulai: Masuk saja ke pengaturan blogspot atau blogger>> Pilih Tema >> pilih edit HTML lalu cari saja kode CSS untuk komentar di bawah ini:


#comments {
  border-top: 25px double rgb(100, 149, 237);
  margin-top: 20px;
  padding: 20px;
border-radius: 50px;
}

Perhatikan kode kode yang sebaiknya modifikasi:
  1. Kode yang disorot merah: border-top: 25px bisa ganti angkanya misalnya menjadi 50px atau lebih kecil dari 25px maka border dash akan menjadi tebal
  2. Kode yang disorot warna kuning: double bisa saja diganti dengan style border seperti: groove, solid, dotted, dashed dst.
  3. Kode yang disorot warna hijau adalah Kode warna rgb(100, 149, 237) yang berarti biru langit, bisa saja diganti dengan kode warna lain baik berupa kode warna HEX maupun dengan menuliskan: solid(nama warna) atau kode warna RGB.
  4. Kode yang saya sorot biru border-radius: 50px; adalah kode tambahan untuk membentuk lengkungan, semakin besar nilainya semakin bulat lengkungannya, misal kita bisa mengganti 50px menjadi 180px untuk membentuk lingkaran sempurna.

border das melengkung menghiasi bagian atas form komentar editblogtema.net
Jadi kesimpulannya pada border dash baku yang disediakan oleh bawaan template blogger kita dapat melakukan hal hal di bawah ini:
  • Ketebalan, kita dapat merobah tebalnya garis border dash
  • Warna, kita dapat merobah warna border dash
  • Lengkungan atau lekukan, kita dapat membentuk border dash menjadi melengkung atau bahkan pada postingan berikutnya kami akan menjelaskan cara membentuk border dash untuk menjadi bingkai postingan atau konten blog.
Itu saja dulu, semoga bermanfaat!

4 Komentar

Silahkan berkomentar sesuai dengan topik kita ya...

  1. Tampilan blog jadi makin cantik ya... eh tergantung kecocokan juga sih, ada yang seneng garis tipis-tipis, putus-putus, atau malah tebel-tebel. Tapi dengan tips ini template blog jadi punya ciri khas. Terima kasih tipsnya Mas Sofyan.

    BalasHapus

  2. Kalau border dashed ini dibikin animasi bisa gak yah mas? Biar berputar jalan gitu. Saya pernah nyoba tapi gagal, elemen didalam border ikut berotasi awkwk

    BalasHapus
Lebih baru Lebih lama

Formulir Kontak