15
Ekim

Yazan: WEBMASTERYOLCU  |  Kategori: Uygulamalı Html Dersleri  |  Okunma: 16.783 Defa

Selamun aleyküm değerli arkadaşlar bu dersimizde sayfamızın arkaplan rengini ayarlamayı ve sayfalarımızda kullanacağımız listeleme işlemlerini göreceğiz yine oldukça önemli bir ders diyebilirim öncelikle bir önceki dersimizi aşağıda hatırlayalım.

Önceki Dersimiz: Web Tasarım Dersleri Yazılar ve Renkler Ders5

  • bgcolor

Bgcolor parametresi ile arkadaşlar sayfamızın arkaplan rengini belirtmek için kullanılan bir parametredir. Kullanış şekli font etiketi kullanımına benzeyen ve en çok dikkat edilmesi gereken nokta </head> etiketinden sonra açılan <body> kapatılmadan yani <body> içerisinde kullanılması gerekir.

  • Arkaplan Çeşitleri

İki çeşit arkaplan verebiliriz sayfalarımıza arkadaşlar birisi şuan anlattığım renk kodu ile dğeri ise ilerleyen derslerde anlatacağım resimlerden arkaplan oluşturarak şimdi anlattığım bcolor olayını uyguluyoruz açıyoruz not defterimizi ve aşağıdaki kodları aynen yazınız siz isterseniz farklı renkler kullanabilirsiniz.

Kodlarımızı yazıp farklı kaydet diyerek arkaplan.html olarak masaüstüne kaydedin arkadaşlar.

<html>
<head>
<title>Webmasteryolcu İle Web Tasarım Dersleri Ders6</title>
</head>
<body bgcolor=”#FF0000″>
<font color=”FFFFFF”> Arkaplan Rengi Kırmızı Yazı Rengi Beyaz Olan Bir Uygulama</font>
</body>
</html>

Html Arkaplan Rengi

Html Arkaplan Rengi

Yukarda ne yaptık onu özetliyim arkadaşlar  <body bgcolor=”#FF0000″> unutmayın arkaplan resim yada renk farketmeksizin <body> içine ekliyoruz ve #FF0000 diyerek kırmızı arkaplan olmasını istedim daha öncede belirttiğim gibi #FF0000 yerine kırmızı rengin ingilizce karşılığı olan red olarakte değer verebilirsiniz.

<font color=”FFFFFF”> Arkaplan Rengi Kırmızı Yazı Rengi Beyaz Olan Bir Uygulama</font> Burda ise daha önceki derslerde anlattığım basitçe yazı şekillendirme kodu yer almakta ve yazıya renk verdim.

Html Listeleme Etiketleri

Html sayfalarda arkadaşlar listeleme etiketleri ile otomatik numaralandırılan listeler oluşturmamız sağlar bu özellik microsoft word proğraındada vardır açarsnız listelemeyi siz satır atladıkça o nuara ekler başına onun bir versiyonuda bu html listelemeler.

  • Sıralı Listeler
  • Sırasız Listeler
  • Tanımlama Listeleri

Yukarda yaptığımda bir listeleme örneğidir arkadaşlar onları nokta değilde rakamda verebilirdim şimdi geçiyoruz listeleme etiketlerine.

  • Sıralı Listeler

Sıralı listeler arkadaşlar harflerden, rakamlardan ve roma rakamlardan oluşur yani bu 3 seçeneği kullanma hakkımız bulunmaktadır.

Numaralandırma şekli nasıl numaralandırma yapmasını istiyorsak <ol type=”…..”> etiketi ile belirlenir ve değer atanır.

Listeleyeceğimiz hemen numaranın yanında yer alacak yazımız ise örnek isimler diyelim <li> etiketleri arasında kalmalıdır.

Sıralı listeler Uygulaması

Not defterimizi açıyoruz arkadaşlar aşağıdaki kodları yazıp farklı kaydetten dosya adına siralilisteler.html olarak kaydedelim siz isimleri farklı kullanabilirisniz.

<html>
<head>
<title>Webmasteryolcu İle Web Tasarım Dersleri Ders6</title>
</head>
<body>
<ol type=”1″>
<li>Web Tasarım</li>
<li>Grafikerlik</li>
<li>Web Programlama</li>
</ol>

<br><br><br>

<ol type=”a”>
<li>Html Bilgisi</li>
<li>Grafik Bilgisi</li>
<li>Tasarım Bilgisi</li>
</ol>

</body>
</html>

Html Sıralı Listeler

Html Sıralı Listeler

Evet Arkadaşlar yukarda iki örnek yaptık biri rakamlar başlayan liste diğeri ise harflerden oluşan bir liste ile yapmış olduk şimdi ise sırasız listeleri ele alacağız.

Sırasız Listeler

Sırasız listelerde sıra listeler gibi kullanım açıısndan hemen hemen aynı sayılır arkadaşlar. Farklı yönleri sıralı listede kullanılan rakam, harf ve roma rakamı kullanılmamasıdır.

Sıralı listeleri nasıl başlatıyorduk <ol type=”…..”> sırasız listelerde ise farklı olarak <ul type=”…..”> yani ol yerine ul parametresi kullanılacak liste sonunda ol ve ul parametrelerini kapatmayı unutmayın.

Sırasız listelerde Seçenekler

  • Dicc: İçi Dolu Daire
  • Circle İçi Boş Daire
  • Square İçi Dolu Kare

Sırasız listelerde 3 seçenekten oluşuyor dedik ve yukarda değerleri verdik arkadaşlar artık kullanı seçimi size kalmış şimdi birde uygulama yapalım hep birlikte açıyoruz not defterimizi ve aşağıdaki kodları başlıyoruz yazmaya yaınca farklı kaydet diyerek dosya adı sirasizlisteler.html olarak kaydediyoruz.

<html>
<head>
<title>Webmasteryolcu İle Web Tasarım Dersleri Ders6</title>
</head>
<body>
<ul type=”disc”>
<li>Web Tasarım</li>
<li>Grafikerlik</li>
<li>Web Programlama</li>
</ul>

<br><br><br>

<ul type=”circle”>
<li>Html Bilgisi</li>
<li>Grafik Bilgisi</li>
<li>Tasarım Bilgisi</li>
</ul>

<br><br><br>

<ul type=”square”>
<li>Webmaster</li>
<li>Grafiker</li>
<li>Programcı</li>
</ul>
</body>
</html>

Html Sırasız Listeler

Html Sırasız Listeler

Yukardaki örnekleri hemen özetleyelim arkadaşlar ne yaptık

İlk örnek Disc kullandım  içi dolu daire şeklinde listeleme yaptım

İkince örnek Circle kullandım içi boş daire şeklinde listeleme yaptı

Üçüncü örnekte ise Square kullandım ve içi dolu kare şeklinde listeleme elde ettim değerli arkadaşlar.

Bugünkü dersimiz ve listele işlemleri bu kadar arkadaşlar bir sonraki dersimiz pazar günü olacak bir gün boş geçiyorum sizlerin sıkılmaması ve bol bol uygulama yapmanız için mutlaka devam edin arkadaşlar sonunda hem geleceğiniz hem hayatınızı değiştirecek imkanlar açacak bu dersler size.

Tüm Ders ve yazılarım istediğiniz legal sitelerde yayınlanabilir kaynak www.webmasteryolcu.com şeklinde belirtmek kaydı ile Allaha emanet olun.



   Paylaş

1 Yorum yapılmış

  • ali
    23 Ekim 2010 | Cevapla

    hocam listeleri yanyana veya hepsini sağa koymak için napmamız lazım? p align denedim olmadı.teşekkürler.

Yorum yapın