İyi bir gelecek, size iyi gelecek | Weeb Akademi
bilgi@weebakademi.com | 0 850 303 88 15 | |
 
 

Bugünkü dersimizde ise hizalamaları ele alacağız arkadaşlar her tasarımda mutlaka kullanmanız gereken bir özelilik.

Hizalama arkadaşlar htmlde yazdığınız bir yazı, resim, yada tablolar aksini belirtmedikçe ekranın soluna ve üstüne yaslanmış olarak karşımıza çıkar bizde bunu ekranda düzgün görüntü alabilmek için hizalama komutlarını kullanacağız.

Geçen Derste paragraf etiketinden bahsederken <p></p> etiketini görmştük şimdi bu etiketin ayrıca farklı amaçlar içinde kullanabileceğini göreceğiz.

P etiketi ile align parametresi ortak kullanılabilir. Align parametresi sayfa içerisinde yazımızın konumunu ayarlamak için kullanıcaz nedir bu konum sağa yasla sola yasla yada ortala şeklinde bir parametredir arkadaşlar.

<p align=”left”> Yazıyı Sola Hizalamak için Kullanılır.

<p align=”center”> Yazıyı Ortalamak İçin Kullanılır (Ortalama sadece ekran sağ soluna göre ortalamadır)

<p align=”right”> Yazıyı Sağa Yaslamak İçin Kullanılır

Hemen Bir Uygulama Yapalım Arkadaşlar

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
<html>
 
<head>
 
<title> Webmasteryolcu İle <a title="Web Tasarım Dersleri" href="http://www.webmasteryolcu.com/web-tasarim-dersleri.html" rel="nofollow">Web Tasarım Dersleri</a></title>
 
</head>
 
<body>
 
<p align="left"> Webasteryolcu.com Yazımız Sola Yaslanmış</p>
 
<p align="center"> Webasteryolcu.com Yazımız Ortalanmış Durumda</p>
 
<p align="right"> Webasteryolcu.com Yazımız Sağa Yaslanmış</p>
 
</body>
 
</html>

Yukardaki kodları not defterimizle yazıp farklı kaydet diyerek dosya adı: hizalama.html olarak masaüstüne kaydediyoruz arkadaşlar.

Hata yapmadığınız sürece aşağıdaki göründeki tasarımı elde etmelisiniz şimdi bu örnekle bolca uygulmalar yapınız arkadaşlar.

Html Yazıları Hizalama Kodu

Html Yazıları Hizalama Kodu

Bugünkü dersimizde bu kadar arkadaşlar bir sonraki dersimiz yatay çizgiler ve çizgilerin boyutlandırılması renklendirilmesi ile ilgili olacaktır.

 
 

Referanslarımız



Facebook Sayfamıza gitmek için TıklayınTwitter Sayfamıza gitmek için Tıklayın