Properti CSS sama

aku h6

aku p

Id dan Class

Gue anak ID

Gue anak class

Warna

Saya di RGB in

hitam

Hijau

referensi untuk mencari warna : Google color picker referensi Warna CSS

Border

Ane adalah percoaban border

Jenis jenis Border CSS

Border solid = lurus

Border dotted = titik titik

Border dashed = garis terpisah

Border double = ada dua border seperti kotak.

Border groove

Border ridge

Border Inset.

Border Outset.

Tanpa Border.

Border tesembunyi.

Border campuran.

Aku adalah tag p dengan border atas

saya top solid di css sebelah

Lengkungan nih kan (Border Radius)

Aku adalah tag p dengan border 5px

Aku adalah tag p dengan border 10px

Aku adalah tag p dengan border penuh warna

Aku adalah tag p

gambaran box yang berisi padding, margin, dan border :

Aku dikasih padding dong

Aku padding dengan 4 arah

Aku padding dengan semuanya

#css w3schools

Memanggil 2 CSS

Saya kombinasi dari tengah dan gede

Background opacity

aku memakai background dengan opacity

Border (lagi)

Contoh border-width

Hijau Solid

Biru Dotted

Individual Side Border

Bisa juga seperti ini

Bagian 1

Bagian 2

A dotted outline

A dashed outline

A solid outline

A double outline

A groove outline. The effect depends on the outline-color value.

A ridge outline. The effect depends on the outline-color value.

An inset outline. The effect depends on the outline-color value.

An outset outline. The effect depends on the outline-color value.

Outline width

Outline ringkas

Outline offset

Text

contoh align-last. a i u ala desa desu a i u ala desa desu. a i u ala desa desu a i u ala desa desua i u ala desa desu. a i u ala desa desua i u ala desa desua i u ala desa.

contoh pakai direction. a i u ala desa desu a i u ala desa desu. a i u ala desa desu a i u ala desa desua i u ala desa desu. a i u ala desa desua i u ala desa desua i u ala.

sebuah gambar dari NP

contoh text decoration

contoh shorthand text decoration

link tanpa garis nandoperd

Contoh Text Transform

Contoh Text Spacing. Contoh Text Spacing Contoh Text Spacing Contoh Text Spacing Contoh Text Spacing Contoh Text Spacing. Contoh Text Spacing Contoh Text Spacing Contoh Text Spacing. Contoh Text Spacing Contoh Text Spacing Contoh Text Spacing Contoh Text Spacing Contoh Text Spacing.

text shadow

Ini tulisan memakai font serif

Ini tulisan memakai font sans-serif

Ini tulisan memakai font monospace

Ini tulisan memakai font cursive

Ini tulisan memakai font fantasy

Ini tulisan memakai font variant small

Font responsive menggunakan font size viewport

Contoh font sofia punyanya google font

Contoh font Audiowide punyanya google font

Contoh font Trirong punyanya google font

Contoh font Audiowide dengan style tambahan

Contoh font Audiowide dengan tambahan efek

Neon Effect

Outline Effect

Emboss Effect

Multiple Shadow Effect

contoh shorthand font

Icon

fontawesome

glyphicon (bootstrap)

google icon

Link

Properti Kursor

Arahkan Kursor ke link di bawah!

List

• Kopi
• Teh
• Soda

• Kopi
• Teh
• Soda

• Kopi
• Teh
• Soda

list outside

• Coffee - A brewed drink prepared from roasted coffee beans, which are the seeds of berries from the Coffea plant Coffee - A brewed drink prepared from roasted coffee beans, which are the seeds of berries from the Coffea plant Coffee - A brewed drink prepared from roasted coffee beans, which are the seeds of berries from the Coffea plant
• Tea - An aromatic beverage commonly prepared by pouring hot or boiling water over cured leaves of the Camellia sinensis, an evergreen shrub (bush) native to Asia

list inside

• Coffee - A brewed drink prepared from roasted coffee beans, which are the seeds of berries from the Coffea plant Coffee - A brewed drink prepared from roasted coffee beans, which are the seeds of berries from the Coffea plant Coffee - A brewed drink prepared from roasted coffee beans, which are the seeds of berries from the Coffea plant
• Tea - An aromatic beverage commonly prepared by pouring hot or boiling water over cured leaves of the Camellia sinensis, an evergreen shrub (bush) native to Asia

• Kopi
• Teh
• Soda

• Kopi
• Teh
• Soda

Tabel

Display

• HTML
• CSS
• PHP

tanpa clear

dengan clear

float tanpa clearfix

Tanpa clearfix maka CSS tidak disetel ulang kemabali alias mengikuti perintah CSS sebelumnya

float dengan clearfix

Ini adalah contoh yang sudah menggunakan clearfix

Float

• Home
• News
• Contact
• About

• Home
• About Us
• Our Clients
• Contact Us

Kelas Semu (Pseudoclsass)

Opacity

Navbar

Klik gambar untuk melihat gambar penuh

Form

CSS Counter (Penomoran otomatis)

html

css

javascript

PHP

!Important

!Important

Corner

Rounded corners!

Two values - border-radius: 15px 50px:

Rounded corners!

Rounded corners!

Border Image

border-image: url(border.png) 30 round;

Multiple Background

Box Shadow

Multiple Shadow

Gradient Background

Card

Logo NP

Text Overflow

text-overflow: clip:

Tulisan di dalam kotak ini sepertinya kebanyakan

TULISAN VERTICAL

Font Face

@font-face

Transform 2D

Transform 3D

Style Gambar

Filter Gambar

Gambar Flip

Modal Gambar

×

Gambar Cermin

Objek Fit

Tooltip

Basic Tooltip

Move the mouse over the text below:

Masking

Masking disini sepertinya tertutup, Silahkan klik Masking

Button

Background button menggunakan class warna, ukuran, dan padding :

Rounded Button

Hoverable button

Button group

Button dalam gambar

Button

Animasi button

Pagination

Multiple Columns

Atur warna pembatas Multiple Columns

Shorthand Multiple Columns

Ukuran Spesisfik Multiple Columns

CSS Variables

Box Sizing

Flexbox

Responsive Web Design

Grid

Media Queries

RWD Images

RWD Referensi Framework

RWD Referensi Template

CSS Grid

Loader