topik CSS

Ini dia yang kamu cari

Ada 32 artikel dalam topik CSS.

Cara Menggunakan Font-awesome untuk Membuat Ikon pada Web

Cara Menggunakan Font-awesome untuk Membuat Ikon pada Web

Dulu… saya sempat berpikir: Pembuatan web sepertinya susah, karena banyak komponen yang harus dibuat. Seperti background dan ikon. Bagi seorang desainer, mungkin tidak masalah membuat banyak gambar background dan ikon. Tapi, bagi programmer atau developer…ini sangat merepotkan. Untunglah ada Font-awesome, yang merupakan framework CSS untuk membuat ikon. Font-awesome memiliki ratusan ikon yang bisa kita gunakan. Pada tulisan ini, kita akan belajar cara membuat ikon menggunakan Font-awesome. Dimulai dari tahap instalasi sampai ke pembuatan animasi.

Cara Cepat Modifikasi Navbar Bootstrap

Cara Cepat Modifikasi Navbar Bootstrap

Ada dua jenis warna pilihan navbar yang ditawarkan Bootstrap: Warna putih (navbar-default) dan warna hitam (navbar-inverse). Selain dari dua warna tersebut, kita harus memodifikasinya sendiri. Pada kesempatan ini, saya akan berbagi cara cepat memodifikasi navbar Bootstrap dengan cepat. 1. Menggunakan GeneratorAda sebuah generator canggih yang dibuat oleh Samuel Marchal. Kita dapat menentukan warna navbar bootstrap sesui selera. Kemudian akan diberikan kode CSS, LESS, SCSS, dan SASS yang dapat kita gunakan langsung.

Apakah Fungsi `!important` pada CSS dan Kapan Harus Menggunakannya?

Apakah Fungsi `!important` pada CSS dan Kapan Harus Menggunakannya?

Memahami fungsi !important pada CSS dan kapan waktu yang tepat menggunakannya?

Tutorial CSS: Membuat Style untuk Badge Notifikasi

Tutorial CSS: Membuat Style untuk Badge Notifikasi

Badge notifikasi sering kali kita temukan dalam website maupun aplikasi. Terkadang badge tersebut menggoda kita untuk mengelik link atau tombol notifikasi. Itulah fungsinya, agar user tau, di sana ada sesuatu yang baru. Badge biasanya dilengkapi dengan angka penghitung. Framework antarmuka semacam Bootstrap sudah menyediakan class sendiri untuk pembuatan badge. Namun, karena badge yang dihasilkan tidak sesui seperti harapan, maka kita harus membuatnya sendiri. Kode CSS.badge-notif { position:relative; } .badge-notif[data-badge]:after {

Membuat Template Wordpress #2: Fungsi-fungsi Dasar Wordpress di Homepage

Membuat Template Wordpress #2: Fungsi-fungsi Dasar Wordpress di Homepage

Pada tutorial sebelumnya kita telah membuat konstruksi awal dari template. Ada dua file yang telah kita dibuat, index.php dan style.css. Sekarang kita fokus pada file index.php. Isinya adalah sebuah HTML percobaan (hello world). Tentu ini bukan tujuan akhir yang kita inginkan, Karena itu, kita akan menggantinya. Mari kita mulai… googletag.cmd.push(function () { googletag.display('div-gpt-ad-multibanner1'); }); Modifikasi File index.phpFile index.php merupakan file utama template.

Belajar Membuat Template Wordpress Sendiri dari Nol

Belajar Membuat Template Wordpress Sendiri dari Nol

Di luar sana, ada banyak sekali bertebaran tema atau template Wordpress gratis. Namun, kita perlu hati-hati dalam menggunakan template gratis tersebut. Beberapa hari yang lalu, saya sudah mengecek website wordpress teman saya. Katanya ia memesan web sekaligus temanya dari seorang developer. Begitu saya cek… Eh, ternyata di sana ada script backdoor yang memungkinkan si developer masuk kapan saja ke web dia. Script ini ditanam pada kode tema atau template.

7 Manfaat Inspect Element Bagi Web Developer

7 Manfaat Inspect Element Bagi Web Developer

Inspect Element merupakan fitur browser yang dibuat untuk memudahkan pengembangan web. Inspect Element dapat kita akses dengan klik kanan, kemudian memilih Inspect Element, atau bisa juga dengan menekan tombol F12. Adapun manfaat dari Inspect Element untuk web Developer adalah sebagai berikut. 1. Tempat Eksperimen CSSSelain ada console Javascript, bisa dibilang di Inspect Elemen juga ada console-nya CSS. Ya, di sana kita bisa eksperimen kode CSS. Sebelum kita menulis kode CSS, sebaiknya gunakan Inspect Element terlebih dahulu.

Tutorial Bootstrap: Memahami Fungsi Tag Meta Viewport

Tutorial Bootstrap: Memahami Fungsi Tag Meta Viewport

Tag Meta Viewport adalah tag HTML yang penting bagi Bootstrap untuk membuat halaman web menjadi responsif.

Cara Menggunakan highlight.js di Blogger

Cara Menggunakan highlight.js di Blogger

Template baawan blogger sudah saya modifikasi sedemikian rupa. Namun, masih ada yang kurang, pewarnaan kode (syntax highlighting). Kode yang saya sisipkan di dalam artikel tidak berwarna. Kadang saya memanfaatkan gist github, pastebin, ideone, dsb. untuk menyisipkan kode yang berwarna. Modul highlight.js berfungsi untuk membuat kode (di web) menjadi berwarna. Kode yang berwarna akan lebih mudah dibaca. Karena itu, kita perlu menggunakan highlight.js. Berikut ini cara menggunakan highlight.js di blogger. 1. Memasang higlight.