face = yazıtipinin adı (arial, tahoma, verdana, ... )
size = yazının büyüklüğü (1-7 arası )
color = yazının rengi (red, green gibi renklerin ingilizce karşılığı yada RGB renk değeri )
Bunlara font etiketinin parametreleri diyoruz.
<font> etiketinin yanısıra öğreneceğimiz bir diğer etiket <br> etiketi. Önce bu etiketin kullanımını göreceğiz. <br> etiketi bir bakıma enter tuşunun görevini görüyor. Bunu biraz açıklayalım; HTML'de metinleri yazarken kullandığımız editörde bir alt satıra geçmek için Enter tuşunu kullanırız. Fakat HTML dilinde bunun hiçbir anlamı yoktur, tüm kodları ve metinleri tek satırda dahi yazsanız browser açısından farketmeyecektir. Bu yüzden metinleri bölmek, yani ikinci satıra atmak için <br> etiketini kullanıyoruz. Ystisnai etiketlerden birisi bu: <br> etiketi sonlandırılmıyor.
Yukarıdaki örneğimizde "pazartesi, salı ve çarşamba"yı yazarken Enter tuşu ile bir alt satıra geçmemize rağmen browser bunu gözönüne alma***** tüm metni bir satırda yazdı. Fakat ikinci sefer ay adlarını tek bir satıra yazdığımız halde bu kez browser aradaki <br> etiketine bakarak bir sonraki metni satır başına aldı. Buradan da anlaşıldığı üzere metni bir alt satıra geçirmek için <br> etiketini kullanıyoruz. Bu etiketin bir özelliği de sonlandırılmaması.
Şimdi font etiketinin kullanımını bir örnekle inceleyelim. Eğer kullanmak istediğiniz font bilgisayarınızda yüklü değilse font etiketi ile biçimlemek istediğiniz metin browser'ın varsayılan fontu ile gösterilecektir. Bu yüzden önce sisteminizde yüklü olan fontları inceleyin (Başlat/Ayarlar/Denetim Masası/Yazıtipleri ). Buradan yazıtiplerini açarak inceleyebilir ve beğendiklerinizi kullanabilirsiniz. Eğer benim örnekte kullandığım yazıtipleri (tahoma, comic sans ms, verdana, arial ) sisteminizde yüklü değilse bunun yerine sizde yüklü olan istediğiniz bir fontu kullanabilirsiniz.
Her zamankinden farklı olarak ve ilk defa sayfamızda renk kullandık. Örnekte de gördüğünüz gibi bu işi renk kodlarıyla yaptık. Aslında bunun bir yolu daha var; o da renk kodu yerine rengin ingilizce adını yazmak (color="red" gibi ).
Bu konuyu renkler bölümünde ayrıntılı olarak inceleyeceğiz. Burada yalnız bir kaç örnekle yetinelim:
Kırmızı-red
Mavi-blue
Siyah-black
Sarı-yellow
Lacivert-navy
Yeşil-green
Bu renkleri yukarıdaki örnek üzerinde deneyin, renk kodunu silin ve rengin ingilizce karşılığını yazın.
HTML'de Listeler
HTML bize üç tip liste hazırlama imkanı veriyor. Bunlar;
Sıralı listeler (ordered list )
Sırasız listeler (unordered list )
Tanımlama listeleri (definition list )
Sıralı listeler rakam veya harf yada her ikisini içiçe kullanarak liste oluşturmamızı, sırasız listeler rakam/harf yerine madde imleri ko***** liste oluşturmamızı sağlar. Tanımlama listeleri ise bir listeden çok kalabalık metinlerde okumayı kolaylaştırmaya yardımcı olabilecek bir araçtır.
Sıralı Listeler
Liste içine alınacak metinler <ol>...</ol> etiketleri arasına alınarak yazılır. Bu etiketler listenin başladığını ve bittiğini belirtir. Liste maddelerinin başına ise <li> (list item ) etiketini getiriyoruz. Bu etikette tıpkı <br> etiketi gibi sonlandırılmıyor. <ol> etiketine parametreler ekleyebiliyoruz. Bunlarla listemizin rakamla mı harfle mi başlayacağını (type ) yada hangi rakam/harfle başlayacağını (start ) belirtebiliyoruz. Compact parametresi ise listenin mümkün olan minimum satır aralığına sahip olmasını sağlıyor.
Bundan sonraki örneklerimizde sayfa kodunun yalnız body (gövde ) bölümünü vereceğiz. Kodun geri kalan kısımlarını kendi sayfanızda tam olarak yazmayı unutmayın.
Listeleri buradaki örnekte olduğu gibi iç içe hazırlamak da mümkün. Dikkat edeceğimiz nokta; işe <ol> etiketi ile başlayıp liste maddelerinin her birisinin başına <li> etiketini getirmek ve listelemeyi bitirmek istediğimiz yerde </ol> etiketini yazmak. Liste içinde yeni bir liste oluşturmak istediğimizde listelenecek maddeden sonra tekrar <ol> etiketini yazıyoruz ve bahsedilen kuralları aynen uyguluyoruz. Type parametresinde kullanabileceğimiz değerler şunlar olabilir; sayılar, harfler (küçük/büyük ) ve romen rakamları (i,ii,iii gibi )
Sırasız Listeler
Bu tip listelerde de mantık aynı. Fark; listeleme yaparken maddelerin başına harf, rakam gibi unsurlar yerine küçük yuvarlaklar, kareler kullanabilmemiz. <ol> etiketi yerine <ul> etiketini kullanıyoruz, liste maddeleri için kullandığımız <li> etiketi burada da geçerli. <ol> için kullanılabilecek parametreler ise şöyle; type için disc (içi dolu daire ), circle (içi boş daire ), square (içi dolu kare ). Compact parametresi sırasız listelerde de kullanılabiliyor.
Bu listelemede kullanılan etiketler şöyle; <dl>...</dl> , <dd> , <dt> Listenin maddelerini belirtmek için kullandığımız <li> etiketinin yerini burada <dd> ve <dt> etiketleri alıyor. Aynı şekilde <ol>...</ol> veya <ul>...</ul> etiketleri arasına aldığımız listeyi bu sefer <dl>...</dl> arasına yazıyoruz. Yine parametre olarak <dl> etiketi içinde compact ifadesini kullanabiliriz.
<dd><font size="2" color="black">HTML (HyperText Markup Language-Hareketli-Metin Yşaretleme Dili ) basitçe, browserlarla görebileceğimiz, internet dökümanları oluşturmaya yarayan bir çeşit dildir...</font>
<dt><font size="3" color="blue">HTML'de Temel Unsurlar</font>
<dd><font size="2" color="black">Bu dilde binary veya hexadecimal kodlar yok. Herşey metin tabanlı ve bir HTML dökümanı oluşturmak için ihtiyacınız olan şey bir editör.Piyasada iki tip editör bulunuyor. Birisi metin tabanlı, kod yazmayı gerektiren...</font>
<dt><font size="3" color="blue">Listeler</font>
<dd><font size="2" color="black">Sıralı listeler rakam veya harf yada her ikisini içiçe kullanarak liste oluşturmamızı, sırasız listeler rakam/harf yerine madde imleri ko***** liste oluşturmamızı sağlar...</font>
HTML'de Renkler
Metin renklendirmeyi yüzeysel olarak fontlar konusunda öğrendik. Şimdi daha ayıntılı olarak ve bu işin mantığına inerek yeniden ele alacağız. Aynı zamanda sayfamıza artalan rengi vermeyi öğreneceğiz.
Renk kodları
Fontlar konusunda, metnin rengini belirlerken <font color="..."> etiketini kullanmıştık ve color komutunun karşısına rengin ingilizce karşılığını yazabiliriz demiştik. Fakat bunun daha karmaşık olan bir başka yolu vardı; o da 16'lık sayı düzeninde renk kodu girmek. Önce sayı düzenleri nedir nasıl olur ona bakalım.
Günlük hayatımızda kullandığımız sayı sistemine 10'luk sayı sistemi deniyor, tüm sayıları 0-9 arası toplam 10 rakamdan oluşan sembollerle ifade ediyoruz. 10'luk sayı sisteminin yanısıra diğer sayı sistemleri de vardır. Bunlardan bilgisayar alanında kullanılan iki tanesi ikili (binary ) ve onaltılı (hexadecimal ) sayı sistemleridir.
İkili sayı sistemi nasıl olur? Bildiğiniz gibi günlük hayatta kullandığımız 10'lu sayı sisteminde 0-9 arası toplam 10 rakam vardır. Aynı şekilde ikili sayı sisteminde de toplam 2 rakam var (bunlar 0 ve 1 ) ve tüm sayılar bu iki rakamı kullanarak ifade edilebilir, nasıl mı? Yşte burada işin içine matematik giriyor. Kısa ve öz olarak belirtmek gerekirse 10'luk düzendeki bir sayıyı ikilik düzene çevirmek için o sayı devamlı olarak 2'ye bölünür ve kalanlar soldan sağa doğru yanyana yazılır.
Gelelim asıl konumuz olan 16'lık sayı sistemine. Bu sayı sisteminde de toplam 16 rakam var bunlar;
Kod: 0 1 2 3 4 5 6 7 8 9 A B C D E F
[10'un karşılığı A ... 15'in karşılığı F'dir.]
Etikette kullandığımız color=#xxxxxx ifadesi ise RGB (red-green-blue,kırmızı-yeşil-mavi ) renklerinin karışım oranlarını belirtir. Bu renklerden herbirinin alacağı değer 00 ile FF aralığında olabilir (FF maksimum, 00 minimum karışımı verir ).
Buna göre; #000000 siyah, #FF0000 kırmızı, #00FF00 yeşil, #0000FF mavi, #FFFFFF beyaz'dır. Diğer renkleri sayıları değiştirerek kendiniz deneyebilirsiniz.
#000000=black(siyah )
#000080=navy(lacivert )
#0000FF=blue(mavi )
#008000=green(yeşil )
#008080=teal(koyu yeşil )
#00FF00=lime(parlak yeşil )
#00FFFF=aqua(turkuaz )
#800000=maroon(vişne çürüğü )
#800080=purple(mor )
#808000=olive(zeytuni yeşil )
#808080=gray(gri )
#C0C0C0=silver(gümüşi gri )
#FF0000=red(kırmızı )
#FF00FF=fuchsia(parlak pembe )
#FFFF00=yellow(sarı )
#FFFFFF=white(beyaz )
Artalanı Renklendirmek
Bu renklerle yalnızca metinleri değil sayfamızın artal*****nı da renklendirebiliriz.
Bunun için <body bgcolor=#xxxxxx> etiketini kullanıyoruz. Daha doğrusu sayfamızın gövdesini belirtmek için yazdığımız <body> etiketini, <body bgcolor=#xxxxxx> şeklinde değiştiriyoruz.
Renk kodlarını yazarken daima # işaretini kullanmayı unutmayın !
