HTML Blok Oluşturma
HTML de blok oluşturma aslında web siteleri için çok önemli bir yere sahiptir. Web sitesinin dizayn yapısı bu bloklar sayesinde belirli bir düzen içinde tutulur. Blokları oluşturmak için <div> etiketi kullanılır. Bloklar sağa ve sola doğru bütün alanı kaplar. Her bir div yeni bir satırdan başlar. Şimdi bir örnek yaparak daha iyi anlaşılmasını sağlayalım.
<html> <head></head> <body> <div>Ne olursan ol yine gel</div> <div>Mevlana </div> </body> </html>
<div> etiketinin özel nitelikleri yoktur. Ama style=”” özelliklerini kullanarak bize çok kullanış sağlamaktadır. Örneğin bir yazıya arkaplan rengi vermek istiyorsunuz. Bunun için her etikete ayrı ayrı style=”” özelliği vermek gerekir. Div sayesinde sadece dive style=”” özelliği vererek bütün yazıya etki edebiliriz. Şimdi buna bir örnek verelim.
<html> <head></head> <body> <h1 style="background:black;color:white;">İstanbul</h1> <p style="background:black;color:white;"> Türkiyenin en kalabalık şehridir. Bir çok tarihi esere ev sahipliği yapar.</p> <div style="background:black;color:white;"> <h1>İstanbul</h1> <p> Türkiyenin en kalabalık şehridir. Bir çok tarihi esere ev sahipliği yapar.</p> </diV> </body> </html>
Buna ek olarak <span> etiketi vardır. Span etiketi blok olarak alanı kaplamaz ve satır atlamaz. Sadece satırda gereken genişliği alır. Şimdi bir örnek yaparak pekiştirelim.
<html> <head></head> <body> <span>Yazılım</span> <span>Sabır</span> <span>ve Emek ile olur.</span> </body> </html>
Son olarak <span> etiketinin de kendine ait nitelikleri yoktur. Ama style=”” özelliği kullanarak stil değişikliği yapabiliriz. Genelde metinde vurgulanmak istenen yerler için kullanılır.
<html> <head></head> <body> <span>Yazılım</span> <span style="color:Blue;font-style:italic;">Sabır</span> <span style="font-size:7px;">ve Emek ile olur.</span> </body> </html>
