17 Sumber Untuk Mahir HTML dan CSS

Artikel ini terdiri dari:

• 3 Situs untuk Belajar HTML dan CSS
• 2 Situs untuk Kumpulan Trik dan Kode CSS
• 12 Artikel Berisi Kumpulan Kode HTML dan CSS untuk membuat daftar, tabel, headline, blockquote, gambar, form, dan button.

 

HTML adalah sebuah bahasa markup berupa kode-kode yang digunakan untuk membuat halaman web, sedangkan CSS merupakan kumpulan kode-kode untuk mengatur tampilan elemen-elemen HTML.

Bagi Anda yang ingin membuat tampilan website/blog dan artikel yang lebih rapi dan menarik, penguasaan HTML dan CSS sangat membantu.

HTML dan CSS tidak sulit dipelajari, asal kita tahu konsep dan cara penggunaannya. Di internet banyak tersedia sumber untuk menguasainya termasuk trik dan contoh-contoh kode untuk membantu kita semakin mahir menggunakan HTML dan CSS.

 

3 Situs untuk Belajar HTML dan CSS

1. w3schools.com

   Situs ini menyediakan tutorial beserta contoh-contohnya sehingga mempermudah untuk memahami konsep dan cara penggunaan kode-kode HTML dan CSS. Kita juga dapat menggunakan editor yang disediakan untuk mengedit kode dan melihat hasilnya.
   Bagi Anda yang baru belajar HTML dan CSS, sangat disarankan untuk mengunjungi situs ini.

   • Tutorial HTML, Contoh HTML
   • Tutorial CSS, Contoh CSS
   
2. HTML.net
   Situs ini juga memberikan tutorial HTML dan CSS.
   
3. Belajar CSS
   Anda dapat belajar CSS dalam bahasa Indonesia di blog ini.

 

2 Situs untuk Kumpulan Trik dan Kode CSS

1. Dynamic Drive
   Memiliki kumpulan kode dan contoh CSS.

2. A List Apart
   Situs ini juga memberikan kumpulan trik untuk CSS.

 

12 Artikel Berisi Kumpulan Kode HTML dan CSS

Daftar dan Tabel

1. Styling your Lists: 20+ Brilliant How to’s and Best Practices
   Kumpulan tutorial cara membuat berbagai macam tampilan daftar (list).
   

2. CSS-Based Tables: Modern Solutions
   Menyajikan kumpulan tutorial untuk membuat berbagai macam tabel.
   

Headline dan Blockquote

3. 10 Examples of Beautiful CSS Typography and how they did it…
   Kumpulan kode CSS untuk membuat berbagai macam headline yang cantik.
   

4. Mempercantik Blockquote dengan CSS
   

Gambar

5. 5 Ways to Spice up Your Images with CSS
   Kumpulan trik untuk mengatur tampilan gambar di web seperti memberi efek watermark, membuat judul gambar, border, yang semuanya menggunakan CSS.
   

6. CSS Image Gallery
   Cara membuat galeri gambar dalam bentuk thumbnail dengan efek image pop-up (gambar dengan ukuran yang lebih besar akan muncul saat mouse ditempatkan di atas gambar).
   

7. Cool CSS Image Pop-up
   Cara lain membuat image pop-up.
   

8. Using CSS for Image Borders
   Cara membuat border pada gambar.
   

Form dan Button

9. Best Tips, Resources and Tutorials for making of Creative Forms using CSS
   Artikel ini menyajikan kumpulan tutorial untuk membuat form yang kreatif.
   

10. CSS-Based Forms: Modern Solutions
    Artikel ini juga menyajikan kumpulan form dari CSS.
    

11. Styling Your Search Form with CSS
    Cara mempercantik tampilan kotak pencarian.
    

12. Collection of CSS Button Styling Tutorials and Techniques
    Kumpulan tutorial untuk membuat tombol (button) yang menawan dengan CSS.
    

---

 

Lain-lain:

• 53 CSS-Techniques You Couldn’t Live Without – menyajikan kumpulan teknik CSS untuk gambar, menu, daftar, dan lain-lain.

• 20 Websites To Help You Learn and Master CSS – 20 situs untuk belajar CSS.

• BrowserShot - tidak semua browser mengartikan kode CSS dengan cara yang sama sehingga tampilannya bisa berbeda. Gunakan BrowserShot untuk melihat tampilan CSS di berbagai browser (Firefox, Flock, Opera, Chrome, Safari, Internet Explorer, dan lain-lain) dan sistem operasi (Linux dan Windows).