Code Solutions

Materi

90

Bahasa

5

Views

371

Semua 90 PHP 15 JavaScript 18 Python 15 HTML/CSS 27 SQL 15
HTML/CSS 4

Membuat Overlay Text di Atas Gambar (Responsive)

Teknik CSS Modern untuk menaruh teks di tengah gambar dengan background gelap transparan (overlay). Sangat sering digunakan untuk banner atau hero section website.

Explore Solution
HTML/CSS 3

Cara Membuat Efek Hover Glow pada Button dengan Tailwind CSS

Tutorial singkat cara membuat tombol interaktif dengan efek cahaya (glow) yang elegan saat kursor diarahkan, menggunakan utilitas class dari Tailwind CSS.

Explore Solution
HTML/CSS 1

Membuat Garis Horizontal (Pemisah)

Menggunakan tag <hr> untuk memberikan garis pemisah antar paragraf atau konten agar lebih rapi.

Explore Solution
HTML/CSS 2

Membuat List dengan Bullet Points

Menggunakan tag <ul> dan <li> untuk membuat daftar urutan yang rapi dengan simbol poin (bullet).

Explore Solution
HTML/CSS 3

Membuat Teks Tercoret (Strike Through)

Menggunakan tag <del> atau <s> untuk menampilkan efek teks tercoret, biasanya digunakan untuk harga diskon atau informasi yang sudah tidak berlaku.

Explore Solution
HTML/CSS 2

Menambahkan Icon Favicon di Tab Browser

Langkah-langkah memasang logo kecil website (favicon) agar muncul di bagian tab browser, memperkuat branding website kamu.

Explore Solution
HTML/CSS 1

Membuat Tombol Download File

Tutorial menggunakan atribut download pada tag link agar file (seperti PDF atau ZIP) langsung terunduh saat diklik oleh pengguna.

Explore Solution
HTML/CSS 3

Mengatur Tinggi Baris Teks (Line Height)

Cara memberikan spasi antar baris kalimat menggunakan properti line-height agar artikel panjang lebih nyaman dibaca pengunjung.

Explore Solution
HTML/CSS 1

Membuat Tabel Tanpa Garis (Clean Table)

Teknik menyusun data menggunakan tabel HTML namun tetap terlihat bersih dan modern tanpa garis border yang kaku.

Explore Solution
HTML/CSS 3

Membuat Teks Menjadi Tebal (Bold)

Cara memberikan penekanan pada kata atau kalimat penting dalam artikel menggunakan tag <strong> atau properti CSS font-weight.

Explore Solution
HTML/CSS 3

Mengatur Transparansi Elemen (Opacity)

Teknik membuat elemen atau gambar menjadi tembus pandang menggunakan properti opacity untuk menciptakan efek visual yang menarik.

Explore Solution
HTML/CSS 1

Cara Membuat Form Pencarian Sederhana

Struktur dasar HTML untuk membuat kotak pencarian yang dilengkapi dengan icon dan tombol submit untuk website.

Explore Solution
HTML/CSS 3

Membuat Teks Menjadi Huruf Kapital Semua

Menggunakan CSS text-transform untuk mengubah teks menjadi huruf besar secara otomatis tanpa harus mengetik ulang satu per satu.

Explore Solution
HTML/CSS 1

Cara Menghapus Garis Tepi Input (Outline)

utorial menghilangkan garis biru (outline) yang muncul saat kotak input diklik agar tampilan form pencarian lebih minimalis.

Explore Solution
HTML/CSS 5

Cara Menengahkan Gambar (Center Image)

Teknik paling mudah dan efektif untuk mengatur posisi gambar agar berada tepat di tengah halaman atau kontainer.

Explore Solution
HTML/CSS 1

Membuat List Tanpa Simbol (List Style None)

Teknik menghilangkan tanda titik (bullet) pada daftar list agar bisa digunakan untuk membuat menu navigasi yang bersih.

Explore Solution
HTML/CSS 4

Menambahkan Gambar sebagai Background

Langkah-langkah memasang gambar latar belakang pada elemen div agar menutupi seluruh area secara proporsional dan responsif.

Explore Solution
HTML/CSS 2

Cara Membuat Border Bulat (Border Radius)

Tutorial mengubah sudut elemen atau gambar yang tajam menjadi melengkung atau bulat sempurna agar tampilan UI lebih modern.

Explore Solution
HTML/CSS 2

Membuat Tooltip Sederhana dengan HTML

ara menampilkan pesan bantuan kecil (tooltip) saat kursor mouse diarahkan ke sebuah teks atau tombol tanpa menggunakan JavaScript.

Explore Solution
HTML/CSS 2

Cara Memasang (Embed) Video YouTube di HTML

Langkah mudah menampilkan video YouTube ke dalam website menggunakan tag iframe agar konten blog jadi lebih interaktif.

Explore Solution
HTML/CSS 2

Cara Membuat Teks Berjalan (Marquee) Terbaru

Menggunakan tag marquee untuk membuat teks pengumuman yang bergerak otomatis dari kanan ke kiri pada halaman website.

Explore Solution
HTML/CSS 2

Membuat Tabel Daftar Harga (Pricing Table) dengan HTML

Cara menyusun tabel list harga produk yang bersih dan profesional menggunakan atribut border-collapse agar tampilan lebih rapi.

Explore Solution
HTML/CSS 2

Struktur Form Login HTML Sederhana untuk Pemula

Panduan membuat kerangka form login dasar menggunakan tag input email dan password yang rapi untuk sistem autentikasi user.

Explore Solution
HTML/CSS 2

Cara Membuat Tombol WhatsApp Melayang (Floating)

Tutorial membuat tombol chat WhatsApp yang tetap muncul di pojok layar saat halaman di-scroll menggunakan CSS position fixed.

Explore Solution
HTML/CSS 10

Membuat Navigasi Link Antar Halaman dengan Tag Anchor HTML

Cara menghubungkan satu halaman web ke URL lain menggunakan atribut href dan optimasi atribut target.

Explore Solution
HTML/CSS 3

Teknik Mengatur Posisi Elemen ke Tengah dengan CSS Flexbox

Solusi modern untuk melakukan centering elemen secara horizontal dan vertikal dalam satu baris kode menggunakan properti Flexbox.

Explore Solution
HTML/CSS 4

Cara Membuat Daftar Terstruktur (List) dengan HTML

Panduan menggunakan tag <ul> dan <ol> untuk menampilkan data poin atau urutan angka secara rapi di halaman web.

Explore Solution