HTML Liste Ekleme(Add A List)

• ANASAYFA
• HTML
• CSS
• İLETİŞİM

• ANASAYFA
• İLETİŞİM

menu

HTML TEMELLERİ

HTML NEDİR ? HTML Başlık(Heading) HTML Paragraf(Paragraphs) HTML Yazı Stili(Font Style) HTML Yazı Formatları(Format Text) HTML Renk Kodları(Color Codes) HTML Link Verme-Ekleme HTML Resim Ekleme(Add a Image) HTML Tablo Ekleme(Add a Table) HTML Liste Ekleme(Add a List) HTML Web Site Penceresi Ekleme(Iframe) HTML Head ve Meta Etiketleri HTML Semboller(Symbols) HTML Form HTML Form Elemanları(Form Elements) HTML Form Giriş Özellikleri (Form Input Properties)

HTML5 İLERİ SEVİYE

HTML 5 NEDİR? HTML Sayfa Bölümleri HTML Form Giriş(Input) Özellikleri HTML Form Elementleri HTML Form Özellikleri(Form Properties) HTML Canvas Kullanımı HTML SVG Kullanımı HTML Video Ekleme-Oynatma(Video Player) HTML Ses Ekleme-Oynatma(Audio Player)

CSS TEMELİ

CSS NEDİR ? CSS CSS-HTML İlişkisi CSS Backgrounds(Arkaplan) CSS Border(Kenarlık) CSS Margins(Dış Boşluk) CSS Padding(İç Boşluk) CSS Height and Width(Yükseklik ve Genişlik) CSS Box Model(Kutu Modeli) CSS Outline(Dış Çizgi) CSS Text(Metin) CSS Fonts(Yazı) CSS Icons(Ikon) CSS Links CSS List(Liste) CSS Tables(Tablolar) CSS Display(Görüntü-Ekran) CSS Layout - Width and Max-width(Yerleşim - Genişlik ve Max Genişlik) CSS Positon(Durum) CSS Overflow(Taşma) CSS Layout-Float and Clear(Yerleşim - Yön ve Temizliği) CSS Image Opacity / Transparency(Opaklık/Saydamlık) CSS Navigation Bar(Gezinme Menüsü) html add a list itemhtml add listenerhtml add list itemshtml sırasız liste türlerihtml sıralı listehtml sıralı liste örneklerihtml sıralı liste oluşturmahtml sıralı liste koduhtml sıralı listelemehtml sıralı liste etiketihtml sıralı sırasız listelerhtml de sıralı liste oluşturmahtml dilinde sıralı liste oluşturmakhtml sıralı liste koduhtml sıralı liste örneklerihtml sıralı liste oluşturmahtml sıralı listelemehtml sıralı liste etiketihtml de sıralı liste oluşturmahtml list ul stylehtml list typeshtml list types stylehtml list type stylehtml list and typeshtml ul dischtml list style dischtml ul circlehtml ul circle sizehtml ul squarehtml square list item HTML Liste Ekleme(Add a List)

Html

Kahve</li> Çay</li> Meyve Suyu</li> </ul> Kahve</li> Çay</li> Meyve Suyu</li> </ul> Kahve</li> Çay</li> Meyve Suyu</li> </ol> Kahve</li> Çay</li> Meyve Suyu</li> </ol>

Web Sayfamıza liste eklemek isteyebilirsiniz. Mesela 'İçecekler' konulu bir yazınız vardır.İçecekleri; kahve, çay, meyve suyu diye liste oluşturabilirsiniz ve bu listedeki elemanlara link vererek ilgili sayfaya yönlendirebilirsiniz.(Link verme dersimize bakabilirsiniz.).Fazla uzatmadan nasıl yaparız ona bir bakalım..

Listeler sıralı ve sırasız liste olarak ikiye ayrılıyor;

1-Sırasız Liste

Sırasız listeler, listelerin başında sayaç bulunmayan yani listemizin sırasını bilemediğimiz simgelerden oluşan listelerdir.

Kullanımı:

Kahve</li> Çay</li> Meyve Suyu</li> </ul>

Gördüğünüz bu örnekte listemizde kaç tane eleman olduğunu bilmiyoruz.

Nasıl Yani 3 Tane Ya İşte ?

Tabi üç tane bunda bir yanlışlık yok fakat bu listede gözümüzle bile kaç tane olduğunu görebiliyoruz. Yani bu listede 30-40 tane eleman olsaydı o zaman teker teker saymamız gerekecek bu da hem yorucu hem zaman kaybı.

Peki ya nasıl kolay yoldan kaç tane olduğunu öğreneceğiz?

Bunun için sıralı liste kullanmalısın onu birazdan göstereceğim.

Ama önce sırasız listemizde varsayılan olan tanımlanan "circle" yani yuvarlak simgemizi nasıl değiştirebiliriz ona bir bakalım.Bunun için sırasız liste etiketimiz olan <ul> ye parametre vermemiz gerekecek.

Parametreler

type: Sadece <ul> etiketinde kullanılan bu parametre sırasız listenin elemanlarının simgesini değiştiriyor.Değerleri ise disc(içi dolu yuvarlak), circle (içi boş yuvarlak), square(içi dolu kare) değerlerini alır.

Kullanımı

Kahve</li> Çay</li> Meyve Suyu</li> </ul>

2-Sıralı Liste

Sıralı listeler, başlangıçtan bitişe kadar numaralı olan listelerdir ve sizin saymanıza gerek olmadan o kendisi numara verir.

Kullanımı

Kahve</li> Çay</li> Meyve Suyu</li> </ol>

Tabi bu numaraların çeşitleri vardır. Bunun için yine aynı parametre yani "type" parametresini kullanacağız.Çeşitler çok olduğu için alt alta yazıyorum.

type değerleri

1: Birden başlayarak değer alır.

A: Büyük harflerle sırasıyla değer alır.

a: Küçük harflerle sırasıyle değer alır.

I: Büyük romen rakamları ile değer alır.

i: Küçük romen rakamları ile değer alır.

Bir örnek yapalım kalanlarını kod editörümde deneyebilirsiniz.

Kullanımı

Kahve</li> Çay</li> Meyve Suyu</li> </ol>

Not: Sıralı listelere type parametresi yazmasanız varsayılan olarak birden başlayacaktır.

Paylaş:

Tweet

Enes KILIÇWebmaster