Antara muka pengguna dan seni bina interaksi

Muat turun Bootstrap

Fail yang disertakan

Menggunakan Bootstrap dalam halaman web

susun atur

Reka letak bersarang dan susun atur mengalir

Susun atur responsif

Tukar susun atur lebar tetap sedia ada kepada reka letak responsif

Kelas utiliti untuk susun atur responsif

Tag dan gaya biasa

senarai

kod

Google Prettify

lembaran

bentuk

Awalan dan akhiran kotak teks

butang radio

kotak semak

pilih senarai

Susun atur borang

butang

kumpulan butang

butang dengan menu lungsur

Menu navigasi

Menu lungsur turun dalam menu navigasi

Reka bentuk responsif menu navigasi

Tab #1

Tab #2

Laluan navigasi dan penomboran

Mesej gesaan

lakaran kecil

kotak dialog

petua alat

Runtuhkan kandungan

karusel

Pengenalan kursus

Contoh kehidupan sebenar reka bentuk responsif

viewport - viewport

Konfigurasikan port pandang secara manual

Ketumpatan piksel

Cara menggunakan pertanyaan media

jenis media jenis media

ciri media ciri meida

nisbah aspek lebar tingkap visual kepada ketinggian

nisbah aspek Nisbah lebar kepada ketinggian peranti

orientasi Arah penggunaan peranti

ketinggian (ketinggian tetingkap visual) dan ketinggian peranti (ketinggian peranti)

lebar (lebar tetingkap visual) dan lebar peranti (lebar peranti)

ketumpatan piksel resolusi

Operator - dan

Sertai berbilang pertanyaan media yang dipisahkan dengan koma

Operator - tidak

Reka letak responsif #1

Reka letak responsif #2

Reka letak responsif #3

Navigasi responsif

HTML untuk menu navigasi

CSS untuk menu navigasi

Togol gaya butang

Gaya menu navigasi responsif

Imej responsif

Imej latar belakang responsif

Saiz peranti yang berbeza menggunakan imej yang berbeza

Gunakan imej latar belakang yang berbeza untuk peranti saiz yang berbeza

Tukar imej latar belakang yang berbeza berdasarkan kepadatan skrin

isi gambar

Tayangan slaid responsif

Butang kawalan slaid

Gaya butang kawalan slaid

Betulkan isu slaid yang ditimpa

Kesimpulan