Web Programlama (HTML, CSS)

HTML, Hyper Text Markup Language kelimelerinin kısaltılmasını ifade eden bir metin işaretleme dilidir. Web sayfalarının oluşturulmasında kullanılır. HTML kodları chrome, firefox, safari, edge, opera gibi tarayıcılar tarafından derlenir ve belge görüntülenir.

Web Programlama dokümanlarına ulaşın.

** code.org Web Laboratuvarına Giriş | code.org sitesindeki Web Laboratuvarını kullanarak web projesi hazırlamak.

01 HTML ile Web Programlama Giriş | HTML nedir?

02 HTML ile Web Programlama | Başlık <h1, h2, h3, h4, h5, h6>, paragraf <p>, biçimlendirme (koyu, eğik, altıçizili, style kullanımı)

03 HTML ile Web Programlama | Resim eklemek <img src=””>, liste yapmak <ul><ol><li>

04 HTML ile Web Programlama | Tablolar <table><tr><td>, Yeni sayfa eklemek.

05 HTML ile Web Programlama | CSS Stil Sayfaları. CSS nedir? Komutları, CSS dosyası oluşturmak, CSS dosyasını kullanmak.

1.Quiz: HTML Web Programlama Değerlendirme Soruları

06 Link Oluşturmak | Sayfaya/siteye köprü oluşturmak.

07 HTML ile Web Programlama | Bölüm oluşturmak, style, class kullanımı. <div>, class, <style>

2.Quiz: HTML Web Programlama Değerlendirme Soruları


08 code.org Web Laboratuvarında web sayfasına video eklemek

09 Web sayfalarını renklendirmek, Çizimler yapmak, Emoji eklemek

10 Menü (yatay) oluşturmak

11 Arka plan (zemin) resmi ayarlamak


HTML Etiketleri (Komutları) Özet

  1. <html> </html> Web sayfasının en başında ve sonunda bulunur.
  2. <body> </body> Web sayfasında bütün içerik buraya yazılır.
  3. <title></title> Web sayfasının başlığı ayarlanır.
  4. <link rel=”stylesheet” href=”style.css”/> CSS stil sayfasına link kurar.
  5. <p></p> Paragraf
  6. <div></div> Bölüm oluşturmak.
  7. <h1></h1> Başlık. h2, h3, h4, h5, h6
  8. <hr> Yatay çizgi.
  9. <br> Alt satıra geçer.
  10. <b></b> Koyu yazı.
  11. <i></i> Eğik yazı.
  12. <u></u> Altı çizili yazı.
  13. <a></a> Link (köprü) oluşturmak.
  14. <table></table> içine <tr></tr> ve tr’nin içine <td> Bilgi buraya</td>
  15. <ul></ul> arasına <li>Bilgi buraya</li> Madde işaretli liste
  16. <ol></ol> arasına <li>Bilgi buraya</li> Numaralandırma ile liste
  17. <img src=””> Resim eklemek
  18. <button></button> Buton oluşturmak.
  19. <marquee></marquee> Kayan yazı, (resim, vb)
  20. <center></center> Style: ortalama
  21. CSS komutları için bu adrese bakabilirsiniz.