Bagi banyak dari kita desain dari template adalah yang paling penting, karena membuat pembaca lebih tertarik dan datang kembali ke blog kita. Ada elemen HTML dimaksudkan untuk ditambahkan tombol keyboard bernama <kbd> yang dapat ditata dengan CSS, jadi mengapa kita tidak menggunakannya untuk membuat elemen-elemen tersebut terlihat seperti tombol keyboard?
Dengan demikian, dalam tutorial ini, saya akan Menunjukkan Cara Untuk Membuat Efek Tombol Keyboard Dengan CSS. Tidak dibutuhkan gambar sehingga blog Anda akan memuat lebih cepat.
Bagaimana Menambahkan Tombol Keyboard ke Blogger
Langkah 1. Dari Blogger Dashboard , pilih blog Anda dan pergi ke Template> Edit HTML
Langkah 2. Klik di mana saja di dalam area kode, tekan tombol Ctrl + F dan cari potongan kode ini:
]]></b:skin>
Screenshot
Langkah 3: Tepat di atas ]]> </ b: skin> sisipkan gaya CSS ini:
kbd{
border:1px solid gray;
font-size:1.2em;
box-shadow:1px 0 1px 0 #eee, 0 2px 0 2px #ccc, 0 2px 0 3px #444;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
margin:2px 3px;
padding:1px 5px;
}
Langkah 4. Untuk menyimpan perubahan, tekan tombol perubahan Simpan.
Terakhir, kita perlu menambahkan html <kbd> tag untuk teks yang kita ingin untuk menerapkan tombol bergaya keyboard .From dashboard blogger Anda, pergi untuk membuat New Post , tulis teks yang kamu ingin
<kbd>Ctrl</kbd> + <kbd>F</kbd>
Screenshot
Ini akan membuatnya terlihat seperti ini:
EmoticonEmoticon