Pos

Menampilkan postingan dari Januari, 2015

Efek Judul Artikel Memudar di Ujung seperti Google Play

Gambar
Artikel kali ini menjelaskan bagaimana cara membuat artikel yang di ujungnya atau akhir terlihat memudar atau semakin kabur dan menghilang. Saya temukan efek ini di halaman Google Play. Coba sobat perhatikan judul-judul aplikasi di halaman Google Play seperti yang terlihat dalam screenshot di bawah ini.

Saya tertarik dengan itu kemudian mempelajarinya. Efek memudar itu hanya menggunakan CSS saja dan sudah saya terapkan di blog ini (jelasinblog dengan template hitam). Perhatikan screenshot di bawah ini.

Anda tertarik? Inilah kode HTML dan CSS untuk membuat efek memudar di ujung atau akhir artikel seperti Google Play.

Anda butuh HTML berikut,
<div class="card"> <div class="card-content"> <div class="cover"> <div class="cover-image-container"> <div class="cover-outer-align"> <div class="cover-inner-align"> <i…

Contoh Cara Membuat Daftar Isi Blogger

Gambar
Berikut ini contoh daftar isi untuk blogger. Daftar isi atau disebut juga sitemap atau ada juga yang menyebutnya halaman indeks.

Cara membuat daftar isi blogger adalah sebagai berikut:
Buatlah sebuah halaman (Masuk ke Dashboard sobat, Klik Halaman, Klik Halaman baru, isikan judulnya seperti biasa).Beralih ke mode HTML.Copy dan paste kode berikut (gunakan tombol Ctrl + C lalu Ctrl + V).<style type="text/css"> /*Outer Border ------------------*/ #toc{width:99%;margin:5px auto;border:; -webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); -moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);} /*Warna Label dan Background ------------------*/ .labl{color:#FF5F00;font-weight:bold;margin:0 -5px;padding:1px 0 2px 11px; background:-moz-linear-gradient(right,#C2EAFE 0%,#055A85 40%); background:-webkit-gradient(linear,left 10,right 80,color-stop(0.20,#055A85),color-stop(1,#C2EAFE)); border:1…