HTML5 ve CSS3: İlk Adımlar

İçindekiler
HTML (Köprü Metni İşaretleme Dili) veya hiper metin işaretleme dili, web sayfalarının geliştirilmesi için kullanılan standarttır, içeriğin hiyerarşisine göre bilgileri yapılandıran etiketlere dayalı bir dildir. HTML kendi başına sunulan bilgilere grafik özellikler vermez, yalnızca mantıksal bir okuma sırasına sahip olacak şekilde düzenler.
ikinci olarak CSS (Basamaklı Stil Sayfası) veya basamaklı stil sayfaları, HTML ile yazılmış yapılandırılmış bir belgenin sunumunu tanımlamak ve oluşturmak için kullanılan bir dildir, tarayıcılar için standart olarak hizmet edecek stil sayfalarının özelliklerini formüle etmekten sorumludur.
Bu derste bir belgenin temel yapısını sunacağız HTML5, en popüler etiketler ve bunları ilan etmek için hiyerarşik sıra. Sırasıyla HTML5 ve CSS3 arasındaki ilişkiyi, bunların nasıl ilişkilendirilebileceğini, yapılan bildirimlerin yapısını açıklayacağız. CSS3 ve HTML belgesine verebilecekleri grafik özellikleri.
Gerçekleştireceğimiz örnekler için bir kod düzenleyiciye sahip olmak gereklidir, bizim durumumuzda seçilen düzenleyici, öğreticide Dreamweaver CC 2014'tür. Dreamweaver CS6 Temelleri: Çalışma Ortamını Bilmek Uygulamanın, sürümlerindeki farklılığa rağmen aynı kalan özellikleri açıklanmıştır.
1. Bir HTML5 belgesinin yapısı

İLE) Bu etiket, belgede kullanacağımız sürümü belirtir, bu durumda HTML'nin 5. sürümüdür.
B) Bir HTML belgesinin açıldığını belirtir, bildirilen ilk etikettir.
C) Diğerlerinin yanı sıra belge, komut dosyaları, stiller, meta bilgiler için bir başlık ekleyebilirsiniz.
NS) HTML belgesi hakkında meta veriler sağlar. Meta veriler sayfada görüntülenmeyecek, yalnızca ekli bilgi olarak analiz edilecektir. Öğeler normalde diğerlerinin yanı sıra sayfa açıklamasını, anahtar kelimeleri, belge yazarını belirtmek için kullanılır. Resimde gösterilen örnekte, sayfanın görüntüleneceği karakter kümesini tanımlamak için charset niteliğini kullandık, İspanyolca dilinde charset = "utf-8".
VE) Tarayıcılarda görüntülenecek sayfanın adını atamamızı sağlar.
F) HTML'deki etiketlerin büyük çoğunluğu bir açılış bildirimine ve bir kapanış bildirimine ihtiyaç duyar:
 Etiket içeriği 
Bu durumda gösterilen resim head etiketini şu şekilde kapatıyor:
G) Bu öğe içindeki her şey tarayıcı tarafından görüntülenecektir, yani bu etiket içinde HTML belgemizin tüm görsel içeriğini belirleyeceğiz.
H) Bölümde anlatıldığı gibi F bu etiketin kapanışı
BEN) Bölümde anlatıldığı gibi F bu etiketin kapanışı
Bir CSS3 belgesinin yapısı

İLE) .class: Bir nokta ile başlayan tüm bildirimler sınıf türündedir, grafik özellikleri herhangi bir HTML etiketine uygulanabilir.
B) #Id: Pound işaretiyle başlayan bildirimler, bunun kimlik türünde olduğunu belirtir. Hem sınıflar hem de kimlikler, HTML içeriğimize hangi grafik niteliklerini vermek istediğimizi belirtmek için kullanılır. Ancak, bu 2 tür ifade arasındaki farklar aşağıdaki gibidir:
Kimlikler benzersizdir:
- Her öğenin yalnızca bir kimliği olabilir.
- Her sayfa, o kimliğe sahip yalnızca bir öğeye sahip olabilir.
Aynı kimlik birden fazla öğede kullanılıyorsa, HTML kodumuz doğrulamayı geçmeyecektir.
Sınıflar benzersiz değildir:
- Aynı sınıf birkaç elementte kullanılabilir.
- Aynı elementte birkaç sınıf kullanabilirsiniz.
Bir sayfada birden çok nesneye uygulanması gereken herhangi bir stil, bir sınıfla yapılmalıdır. CSS belgelerinde belirtilen her şeyin büyük/küçük harf duyarlı olduğunu belirtmek önemlidir.
C) {Özniteliklerin bildirilmesini başlatan parantez açma.
NS) } Bir sınıfa veya ID'ye yapılan tanımlamaları kapatan anahtar.
VE) Nitelik yapısı: Bir nitelik bildirdikten sonra değerini belirtmek gerekir, resimde gösterilen örnekte #Id'ye 600 piksellik bir yükseklik atadık.
Nitelikleri ve değerlerini ayırmak için noktalı virgül kullanılır; resimde gösterildiği gibi.
Bunlar, basit bir şekilde, bir kodun yapısının genel özellikleridir. HTML, gerekli etiketler ve nasıl sipariş edileceği. Bu durumuda CSS beyanname türleri ve genel yapısı. Bu bilgi ile ilk HTML'mizi yapmaya ve etiketlere grafik özelliklerini vermeye hazır olacağız.Bu Eğitimi beğendiniz ve yardım ettiniz mi?Yazara olumlu puan vermek için bu düğmeye basarak yazarı ödüllendirebilirsiniz.
wave wave wave wave wave