Tutorial CSS Fundamental Lengkap Pemula sampai Mahir

Tutorial CSS Fundamental

Tutorial CSS Fundamental – HTML dan CSS merupakan dua teknologi dasar wajib dikuasai oleh orang yang ingin terlibat dalam pembangunan Web. Teknologi HTML (HyperText Markup Language) berperan dalam membangun struktur halaman web. Sedangkan CSS (Cascading Style Sheets) berperan untuk mengatur tampilan web agar lerlihat rapi dan indah.

Banyak orang yang meremehkan penguasaan HTML & CSS karena ada banyak software HTML editor WYSIWYG (What You See Is What You Det) seperti Dreamweaver, FrontPage, HomeSite dll yang memudahkan kita dalam membuat & mengedit file HTML. Padahal file HTML Editor hanyalah alat untuk mempermudah, kalau kita sudah mengetahui dan menguasai teknologinya maka kita tidak akan tergantung pada aplikasi HTML Editor tertentu. Bahkan sebenarnya kita bisa membuat dan mengedit file HTML dengan hanya aplikasi gratis dan sederhana seperti Notepad.

Pada kesempatan kali ini saya akan memberikan tutorial gratis untuk kalian semua 🙂 tutorial apa sih mang ? yaitu tutorial membuat website dengan css , mari belajar desain web dengan bahasa css dan xhtml ya , utnuk tutorial xhtmlnya bisa anda cek di tutorial sebelumnya ya mas gan . oke cekidot langsung cek tutorial cssnya di bawah .

TUTORIAL AKAN DI UPDATE TIAP HARI

BAB I DASAR-DASAR CSS BAG 1

1.1 Document Object Model

1.2 Inline Style

1.3 Embedded Style

1.4 Link Style

1.5 Import Style

1.6 Multi dan Contextual Selector

1.7 Universal Selector

1.8 Child dan Sibling Selector

1.9 Menambahkan Komentar

BAB II DASAR-DASAR CSS BAG 2

2.1 Id Selector

2.2 Classs Selector

2.3 Pseudo Class Selector

2.4 Pseudo Element Selector

2.5 Div dan Span

2.6 Mengatur Area Div

2.7 Inheritance dan Conflict CSS bag 1

2.8 Inheritance dan Conflict CSS bag 2

2.9 Merapikan Struktur File

BAB III DASAR-DASAR CSS BAG 3

3.1 Block dan Inline Element

3.2 Display dan Visibility

3.3 Ukuran Absolute pada CSS

3.4 Ukuran Persentase dari Lebar

3.5 Ukuran Persentase dari Font bag 1

3.6 Ukuran Persentase dari Font bag 2

3.7 Ukuran Relative em bag 1

3.8 Ukuran Relative em bag 2

3.9 Ukuran Relative ex

3.10Size dan Overflow

BAB IV PADDING, BORDER DAN MARGIN

4.1 Mengatur Margin bag 1

4.2 Mengatur Margin bag 2

4.3 Mengatur Margin bag 3

4.4 Mengatur Margin bag 4

4.5 Mengatur Border

4.6 Mengatur Padding

BAB V MENGATUR LAYOUT DAN POSISI

5.1 Float dan Clear bag 1

5.2 Float dan Clear bag 2

5.3 Float dan Clear bag 3

5.4 Float dan Clear bag 4

5.5 Gallery Foto dengan Float

5.6 Posisi Absolute bag 1

5.7 Posisi Absolute bag 2

5.8 Posisi Absolute bag 3

5.9 Posisi Absolute bag 4

5.10 Posisi Absolute bag 5

5.11 Posisi Relative bag 1

5.12 Posisi Relative bag 2

5.13 Posisi Fixed bag 1

5.14 Posisi Fixed bag 2

BAB VI MENGATUR TYPOGRAPHY

6.1 Font Family dan Size bag 1

6.2 Font Family dan Size bag 2

6.3 Font Style dan Weight

6.4 Text Decoration

6.5 Letter dan Word Spacing

6.6 Text Transform dan Font Variant

6.7 Mengatur Vertical Space bag 1

6.8 Mengatur Vertical Space bag 2

6.9 Font Shorthand

6.10Mengatur Teks

BAB VII STYLE TABEL DENGAN CSS

7.1 Elemen Table pada XHTML Strict

7.2 Style Table dengan CSS bag 1

7.3 Style Table dengan CSS bag 2

7.4 Style Table dengan CSS bag 3

BAB VIII MENGATUR LIST ITEM

8.1 List Style Type

8.2 List Style Position dan Image

8.3 List Style Shorthand

8.4 List Item Horizontal

8.5 Link Pada List Item

BAB IX MENGATUR BACKGROUND DAN CURSOR

9.1 mengatur Background bag 1

9.2 mengatur Background bag 2

9.3 Background Shorthand

9.4 Rollover Link bag 1

9.5 Rollover Link bag 2

9.6 Rounded Corner bag 1

9.7 Rounded Corner bag 2

9.8 Rounded Corner bag 3

9.9 Mengatur Tampilan Cursor

BAB X APLIKASI PENDUKUNG DAN RINGKASAN

10.1 Template HTML dan CSS bag 1

10.2 Template HTML dan CSS bag 2

10.3 Troubleshooting

10.4 Bgpatern.com

10.5 Roundedcorner.com

10.6 Add-on ColorZilla

10.7 Layout Generator bag 1

10.8 Layout Generator bag 2

10.9 Layout Generator bag 3

10.10 Ringkasan

10.11 Penutup

Tutorial CSS Fundamental – Bagi yang mau melihat video tutorial lainnya anda bisa langsung ke channel youtube kami Channel Youtube Mamang Photography