pert 04 html dan web programming
TRANSCRIPT
![Page 1: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/1.jpg)
HTML & WEB PROGRAMMING
By :I Ngh Putu Mardika, S.Pd
![Page 2: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/2.jpg)
HTML LAYOUTS
![Page 3: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/3.jpg)
Jenis Layout
• Fixed LayoutLebar layout tetap dan tidak tergantung pada lebar layar. Ukuran tampilan pada layar tergantung pada resolusi layar (screen).
• Fluid LayoutLebar layout menyesuaikan dengan lebar layar. Ukuran tampilan pada layar tidak tergantung pada resolusi layar (screen).
![Page 4: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/4.jpg)
HTML Layouts
•Elemen Tabel•Elemen Div•Elemen HTML 5
![Page 5: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/5.jpg)
Tag Tabel (Table) - layout
![Page 6: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/6.jpg)
![Page 7: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/7.jpg)
Tag Tabel (Table) – layout
![Page 8: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/8.jpg)
HTML LAYOUTS (dengan Elemen DIV)
![Page 9: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/9.jpg)
HTML LAYOUTS (dengan Elemen DIV)
![Page 10: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/10.jpg)
HTML LAYOUTS (dengan Elemen DIV)
![Page 11: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/11.jpg)
Layout dengan HTML 5
![Page 12: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/12.jpg)
![Page 13: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/13.jpg)
Style Sheet
![Page 14: Pert 04 HTML dan Web Programming](https://reader030.vdocuments.site/reader030/viewer/2022032619/55bed9c6bb61ebff7d8b46e1/html5/thumbnails/14.jpg)
Exercise -01
• Buatlah web layout dengan tampilan seperti salah satu gambar berikut!
Logo
Navigasi
Navigasi
Navigasi
Logo
Navigasi