HTML'de numaralandırma listesi. İşaretli Liste HTML Numaraları - HTML Dersleri

Numaralandırılmış listeler, sıra numaralarıyla bir dizi öğedir. Görünüm ve numaralandırma türü etiketin niteliklerine bağlıdır

bir liste oluşturmak için kullanılır. Numaralı listenin her noktası etiketle belirtilir
1. Aşağıda gösterildiği gibi.
   1. İlk nokta
   2. İkinci nokta
   3. Üçüncü nokta

   Herhangi bir ek nitelik belirtmezseniz ve basitçe bir etiket yazarsanız

   Örnek 11.3'te gösterildiği gibi, Arap numaralarına (1, 2, 3, 3, ...) varsayılan listesi uygulanır.

   Örnek 11.3. Numaralı bir liste oluşturma

   Zamanla çalışmak

   1. dakiklik oluşturulması (asla geç kalmayacak);
   2. dakiklikten tedavi (asla hiçbir yerde acele etmeyeceksiniz);
   3. zaman algısının ve saatin değişmesi.

   Sonuç bu örnek Şekil l'de gösterilmiştir. 11.3.

   İncir. 11.3. Numaralı bir listenin görünümü

   Otomatik girintiler üstlerinin, numaralandırılmış listeye, metnin altından ve solundan eklendiğini unutmayın.

   Aşağıdaki değerler numaralandırma öğeleri olarak hareket edebilir:

   • arap numaraları (1, 2, 3, ...);
   • sermaye latin harfleri (A, B, C, ...);
   • küçük harf latin harfleri (A, B, C, ...);
   • kayıt Romen Numaraları (I, II, III, ...);
   • lcd roma numaraları (I, II, III, ...).

   Numaralı liste türünü belirlemek için Tag özelliği, Tip Tag özelliği uygulanır.

   . Olası değerleri tabloda verilmiştir. 11.2.
   Masa. 11.2. Numaralı Liste Türleri

   Liste türü	HTML Kodu	Misal
   Arap numaraları		1. Cheburashka 2. Timsah Gena 3. Shapoklyak
   Latin alfabesinin büyük harfleri		A. Cheburashka B. Timsah Gena C. Shapoklyak
   Latin alfabesinin ltrical harfleri		a. Cheburashka b. Timsah cin c. Shapoklyak
   Büyük harfte roma numaraları		I. Cheburashka II. Timsah cin III. Shapoklyak
   Alt Kayıtta Romen Numaraları		ben. Cheburashka II. Timsah cin III. Shapoklyak

   Bir listeyi belirli bir değerden başlatmak için, Start Tag özelliği kullanılır.

   . Tip kullanarak hangi listenin kurulduğu önemli değil, başlangıç \u200b\u200bözniteliği, Roma ve Arap numaralarıyla aynı derecede çalışıyor. Örnek 11.4'te, sekiz ile başlayan büyük harfte Roma numaralarını kullanarak bir listenin oluşturulması gösterilir.

   Örnek 11.4. Numaralandırma listesi

   8. King Magnum XLIV.
   9. Kral siegfried xvi
   10. King Sigismund XXI
   11. Kral Husbrandt I.

   Bu örneğin sonucu Şekil 2'de gösterilmiştir. 11.4.

   

   İncir. 11.4. Roma numaraları ile numaralandırılmış liste

   İÇİNDE hTML Dili İki tür liste vardır: Numaralandırılmış ve ölçülmemiş. Yaratılışları pratik olarak aynıdır. Etiketler bile bir karakter üzerinde farklılık gösterir. Ayrıca, hem numaralı hem de işaretleyici içerebileceğini de oluşturabilirsiniz.

   Bu listeler istediğiniz gibi dönüştürülebilir. Hepsi hayal gücünüze bağlıdır. İlk önce standart listeleri, içinde olduğu gibi düşünüyoruz editör kelime.Ve sonra onları geliştirir ve tanınmaz hale getireceğiz.

   Numaralı Liste HTML

   Her zamanki numaralı aşağıdaki etiketleri kullanarak oluşturulabilir:

   1. İlk Liste Listesi
   2. Listenin ikinci listesi
   3. Üçüncü List Listesi

   Basit listeler böyle görünüyor

   Standartlara göre, her liste öğesinin açılış ve kapanış etiketinin içinde olmalıdır. Ancak kapanış etiketini koymazsanız, sonuç tamamen aynı olacaktır. İşleyici çok akıllı. Liste dönüşümü sırasında, açılış etiketlerini analiz eder. Yeni görürse

   4. , sonra otomatik olarak onun önüne koyar.
   .

   Böylece, listeler aşağıda gösterildiği gibi yapılabilir.

   

   Ancak profesyonellerin bakış açısına göre yanlış.

   

   Boyutsuz (veya işaretleyici) listeleri aynı şekilde oluşturulur, yalnızca OL Tag yerine UL yazılmıştır.

   Sayısı veya harf yok - sadece Çeşitli sembollerhangi işaretçiler denir.

   

   Çok Seviye Numaralı HTML Listesi

   Birçok kullanıcı böyle bir fırsatla ilgileniyor. Bu nedenle, herhangi bir HTML numaralı listenin çok düzeyde yapıldığı belirtilmelidir. Ek seviyeler aynı veya işaretli olabilir.

   

   Yukarıdaki örnekte belirtilen bir liste oluşturmak için aşağıdakileri yazmanız gerekir.

   

   Lütfen bu kodda, ilk örneklerin aksine, tür niteliği eklendi. Onun sayesinde hem numaralandırılmış hem de işaretleyici listeleri için sıralama türünü belirleyebilirsiniz.

   Numaralar için, alfabeyi veya sayıları ve diğer durumlarda - işaretleyici türünü gösteririz.

   Özel bir HTML etiketi kullanıyorsanız, numaralı bir liste istediğiniz şekilde olabilir.

   Tür niteliğini tablodaki herhangi bir değerle belirleyebilirsiniz. Veya CSS Stil sınıfında, liste tarzı türünü istediğiniz sıralama türüyle belirtin.

   

   Değerlerin devri oldukça basittir. Yeterince temel bilgi İngilizce dilinin. Ancak "Circle", "kare", vb. Kelimelerini tercüme edemezseniz bile, bu değerleri tür niteliğinde belirttiğinizde sonucun ne olacağını görsel olarak anlayabilirsiniz.

   Numaralı listeler için aşağıdaki seçenekleri kullanmanız gerekir:

   • 1 - Arapça Rakamlar;
   • Bir başkent;
   • a - küçük harf latin harfleri;
   • Ben - Capital Roma numaraları;
   • ben - küçük harf romen numaraları.

   Varsayılan olarak, liste her zaman kullanılırsa, bir şey belirtmemişseniz, Type \u003d "1" olarak eşdeğerdir.

   Ek olarak, numaralandırılmış listeler istenen konumdan başlatılabilir. Varsayılan olarak, 1. olan çıktı, ancak isterseniz, en az yüzünden başlayabilirsiniz. Bunu yapmak için, başlangıç \u200b\u200bözelliğini herhangi bir değerle belirtin.

   

   Ek olarak, ters sırayla sonuçlandırılabilir. Bunu yapmak için, bir referans yazdı.

   

   Listelerin kaydı

   Numaralı HTML listesi, bu kadar güzel bir şekilde yapılabilir, bunun her zamanki listesi olduğunu tahmin etmek mümkün değildir ve Photoshop'ta yapılan resim değil.

   İşte güzel listelerin örnekleri.

   

   Örnekten de görülebileceği gibi, değiştirebilirsiniz görünüm Numaralandırma ve elementler kendileri.

   Düzenli bir liste oluşturun böyle olabilir.

   

   CSS stillerinde, OL etiket için tasarımını belirtmeniz gerekir. Lütfen bu durumda ayarların, bu stil dosyasının kullanıldığı tüm sitenin tüm listelerine uygulanacağını unutmayın.

   

   Önce listenin yuvarlak bir tasarımı olan seçeneği düşünün. Liste koduna geri dönün. Yuvarlak liste sınıfı belirtildi. Böyle bir güzellik yapmak için bu sınıfın bu sınıfı ile birlikte. Sınıfı istediğiniz gibi arayabilirsiniz.

   

   

   

   Şimdi kare tasarımını düşünün.

   

   Stiller çok benzer. Fark, ilk durumda, elemanı CSS'nin yetenekleri ile yuvarlatmasıdır.

   Profesyonel Gag, tüm kullanıcıların kullanmadığını öngörmek ve anlamak gerekir. modern bilgisayarlar. Herkesin Windows 7, 8, 10'a sahip değil. Windows XP'de hala oturan ve eski sürümleri kullanan kullanıcıların yüzdesi var. internet tarayıcısı Explorer.

   Kural olarak, elemanların neredeyse tüm modern tasarım geliştirmeleri desteklenmez. Site tasarımının hiç çalışmadığı kullanıcıya görünecektir. Her şeyin çıktığı. Elemanlar birbirlerine koşar. Bunu önlemek için, tüm seçenekleri hesaplamanız gerekir.

   Bazı Webmasterlar gözlerini onlara kapatır, çünkü modern pazardaki payları daha az ve daha az hale geliyor. Ancak profesyonel için her ziyaretçi, özellikle bu ticari bir site ise önemlidir.

   Herkes için uygun bir şey yapın veya tüm tarayıcı seçeneklerini düşünün.

   Tek fark, bu etiketin kesinlikle listeleri numaralandırmak için yapılmasıdır. Etiketin adı İngilizce Azaltma "Sipariş Listesi" - bir numaralı liste.

   Sözdizimi etiketi

   1. Öğe # 1.
   2. Element # 2.
   3. Öğe # 3.
   4. ...

   Öznitelik türü \u003d "değer", aşağıdaki değerleri alabilir.

   • A - belirteçleri sermaye latin harfleri biçiminde belirtir (A, B, C.);
   • a - küçük harf latin harfleri şeklinde işaretleyicileri ayarlar (A, B, C.);
   • I - işaretçileri büyük Roma numaraları şeklinde ayarlar (I, II, III, IV ..);
   • i - Küçük Roma numaraları şeklinde işaretleyicileri ayarlar (I, II, III, IV ..);
   • 1 (varsayılan olarak) - işaretçileri Arapça numaraları şeklinde ayarlar (1, 2, 3 ..);

   Start \u003d "Value" niteliği, raporun başlangıç \u200b\u200bdeğerini (başlangıç \u200b\u200bdeğeri) ayarlar.

   Ters çevrilmiş nitelik, iade hesabını (gerekirse) ayarlar.

   Etiket

   kapanış etiketinin zorunlu kullanımı gerektirir

   Liste öğesinin oluşumu için bir çift etiketi kullanılır

   1. . İşaretli listenin içeriği olan ayrı kelimeler, ifadeler, paragraflar, görüntüler, kod parçaları ve daha fazlası vardır, açılış ve kapanma etiketleri arasında bulunur.

      Not

      Listenin içinde hesabınızı değiştirmek mümkündür. Bunu yapmak için, özel bir özellik değeri \u003d "" etiketi

   2. bazı sayısal değer atanır. Örneğin

      1. Öğe # 1.
      10. Element # 2.
      11. Öğe # 3.

      HTML'de numaralı listeler içeren örnekler (

      )

      Örnek 1. Latin harfler şeklinde numaralı HTML listesi

      Örnek S. büyük harfler

      1. Öğe # 1.
      2. Element # 2.
      3. Öğe # 3.

      1. Öğe # 1.
      2. Element # 2.
      3. Öğe # 3.

      Katı harflerle örnek

      1. Öğe # 10.
      2. Öğe # 11.
      3. Öğe # 12.

      Sayfada böyle görünüyor:

      1. Öğe # 1.
      2. Element # 2.
      3. Öğe # 3.

      Örnek 2. Romen harfleri şeklinde sayısal HTML listesi

      Büyük harflerle örnek

      1. Öğe # 1.
      2. Element # 2.
      3. Öğe # 3.

      Sayfada böyle görünüyor:

      1. Öğe # 1.
      2. Element # 2.
      3. Öğe # 3.

      Katı harflerle örnek

      1. Öğe # 1.
      2. Element # 2.
      3. Öğe # 3.

      Sayfada böyle görünüyor:

      1. Öğe # 1.
      2. Element # 2.
      3. Öğe # 3.

      Örnek 3. Numaralı HTML Listesi Çeşitli Başlat Konumu

      Sayfanın başlangıç \u200b\u200bdeğerini ayarlamanızı sağlayan başlangıç \u200b\u200bözniteliğinin özelliklerini gösteren bir örnek.

      50. Öğe # 1.
      51. Element # 2.
      52. Öğe # 3.

      Sayfada böyle görünüyor:

      1. Öğe # 1.
      2. Element # 2.
      3. Öğe # 3.

      Örnek 4. Rakamlarda sayımı değiştir HTML

      Aşağıda, etiketlerde yeni öğeleri görüntülerken değer özelliğini kullanarak sayaç değerlerini değiştirme yeteneği olan bir örnektir.

   3. .

      10. Öğe # 1.
      11. Element # 2.
      100. Öğe # 3.
      101. Element # 4.

      Sayfada böyle görünüyor:

      1. Öğe # 1.
      2. Element # 2.
      3. Öğe # 3.
      4. Element # 4.

      Örnek 5. HTML'de Reversible Numaralı Liste

      Aşağıdaki bir ters numaralı listenin bir örneğidir (arka sırayla hesap).

      10. Öğe # 1.
      11. Element # 2.
      12. Öğe # 3.
      13. Element # 4.

      Sayfada böyle görünüyor:

      1. Öğe # 1.
      2. Element # 2.
      3. Öğe # 3.
      4. Element # 4.

      Listeler, bilgiyi kolaylaştırırken, içeriğin önemli bir bileşenidir. Listelerdeki metinler daha iyi algılanan ve hatırlanması daha kolaydır.

      En basit - her bir elementten önce bir işaretleyici - bir daire, kare veya bir daire. İşaretli listedeki elemanların sırası önemli değildir.

      Yaratmak için sadece iki etiket kullanmanız gerekir:

      ve
      • .
        - Bu, elemanları etiketle ayarlanmış bir liste içeren bir kaptır.
        • .
          • Bir kaya
          • Makas
          • Kâğıt

          Varsayılan olarak, bir liste işaretleyici olarak siyah bir daire kullanılır ( dİSK.). Etikete ekleme

          öznitelik tip ve karşılık gelen değeri kendisine atamak, işaretleyici daireye değiştirilebilir ( daire) veya siyah kare ( meydan.).

          Elementlerin sırasının önemli olduğu gerçeğinden farklıdır ve bu nedenle işaretleyici yerine, sürekli olarak sayı veya harfler burada kullanılıyor. Listedeki siparişi önemsemenize gerek yok: Tarayıcı bu görevi alır. Listeyi değiştirirseniz (bir öğeyi silmek veya eklemek, siparişi ihlal etmek için), tarayıcı onu yeniden hesaplar ve doğru görüntüler.

          Numaralı listeler oluşturmak için kullanılan etiketler

          ve
          1. . Konteyner
             Listenin başlangıcını ve sonunu belirler, etiket
             1. Öğenin başlangıcını ve sonunu belirtir - her şey sadece işaretli listedeki gibidir.
                İle ikame edilmiş
                .
                1. Bir kaya
                2. Makas
                3. Kâğıt

                

                Numaralı listelerden beri etiket için her zaman çok basit değildir

                Aşağıdaki özellikleri oluşturdu (lütfen dikkat: Numaralandırılmış liste aşağıda gösterilmiştir):

                1. tip. Bu özellik, yalnızca Arapça tarafından değil, aynı zamanda Roma numaralarını veya farklı bir sicilin latin harflerini de numaralandırmanıza izin verir. tip Değerleri 1 (Varsayılan), A, A, I, I'yi destekler (kendinizle deneyin).

                2. başlat.. Her zaman numaralandırma bir birimle başlamalıdır. Bu özellik, başlangıç \u200b\u200bdeğerini ayarlamanızı sağlar - listenin ilk öğesinin sayısı. Raporun, örneğin 100 numaralı veya K harfi ile başladığını belirtilebilir.

                3. tersine çevrildi.. Liste 1'den 10'a kadar gidilmemesi ve 10'dan 1'e kadar, bu özniteliği kullanmanız gerekir. Belirtilirse, numaralandırma ters sırada gerçekleştirilecektir.

                Listenin ortasında keyfi bir sayı öğesi ayarlamak için etikette kullanmanız gerekir.

                1. öznitelik :

                2. Otuz sekizinciden sonra kırk beşinci eleman

                Listenin ortasındaki bir eleman sayısını değiştirerek, aşağıdaki tüm öğelerin numaralandırılmasını değiştirirsiniz - Rapor, Değer Özelliğindeki değerle başlayacaktır. Örneğin, 35 eleman (18) numarasını atadıysanız, ardından aşağıdaki öğeler 19, 20, 21 ve 36, 37, 38 numaraya sahip olacaktır.

                Tanımlar Listesi

                Yukarıda tartışıldığı gibi iyi bilinen bir liste türü değil. Terimlerden ve tanımlarından oluşur. Etiketlerin yardımıyla oluşturuldu:

                - Bir liste içeren konteyner.

                - Terminal Etiketi.

                - Tanım etiketi

                Tanımlar listelerinin kapsamı - Sözlük, Referans Kitaplar, Testler, Sözlükler ve "Terim - Açıklama" tipinin diğer duyumları.

                İşte tanımların bir listesine örnek:

                Tanımlayıcı

                İşaretleme dilinin ana birimi, herkes tarafından "etiket" olarak bilinir.

                Öznitelik

                Ona veren etiket emlak ek özellikler Metin tasarımı.

                Etiket

                Kapatmak zorunda olmayan tek bir etiket.

                

                Birbirine ekli listelerden oluşan liste. Farklı tiplerin listelerini içerebilir. Yaratılışın karmaşıklığı, doğru yuvalama etiketlerine uymaktır, çünkü çok seviyeli bir yapıda karıştırılması kolaydır.

                İşte çok seviye listesine bir örnek:

                Programlama dilleri ayrılır:

                • Yapısal
                1. Paskal
                2. Oberon.
                1. Limbo.
                • Nesne odaklı
                1. Java.
                • Fonksiyonel
                1. Lisp
                2. Python

                HTML İşaretleme dilinde, 3 tip liste seçilir - (numaralandırılmış), düzensiz (ölçülmemiş) ve tanım listesi listeleri (Tanım Listesi).

                Böyle bir liste oluşturmak için, 2 çeşit öğeye ihtiyacınız vardır: 'ul' (sırasız listeden, yani bozuk listeden kısaltma) ve 'li' (liste öğesi). 'Li' içinde yazılmış olan tek şey belirteçtir.

                Böyle bir listenin görünümü belirteç türlerini ayarlayarak kontrol edilebilir.

                Belirteç türleri

                Listenin her iki öğesine yerleştirilen özel bir özellik özelliği vardır. Bu, işaretçinizin türüdür. Toplam 3 tip: daire, disk ve kare:

                - Meydan
                - Disk
                - daire

                İşaretçi türünün nerede belirtileceğine bağlı olarak, listeden veya belirli bir öğeden değiştirebilirsiniz.

                Sayısal Liste (Sipariş Listesi)

                Bir liste oluşturmak için ayrıca 2 elemana ihtiyacınız var: 'ol' ve 'li' (Liste öğesi). İşaretçiler bir noktaya sahip sayılarla değiştirilir. Basit bir liste örneği:

                1. İlk eleman
                2. ikinci eleman
                3. Son element

                Sipariş edilen bir listenin görünümü ayarla kontrol edilebilir farklı şekiller Numaralama.

                Numaralandırma türleri

                'OL' ya da 'Li öğesinde yüklü olan özel bir özellikli özel bir özellik vardır. Bu, listenizin türüdür. Toplam 5 tip:

                - Arapça numaralarını numaralandırma (1, 2, 3)
                - Büyük harflerle numaralandırma (A, B, C)
                - Küçük harflerle numaralandırma (A, B, C)
                - Büyük Roma numaralarına göre numaralandırma (I, II, III)
                - Küçük Roma numaralarıyla numaralandırma (I, II, III)
                - Numaralandırmaya başlamak için hangi haneli ile

                Nerede numaralandırma türünü belirteceğinize bağlı olarak, listeden veya belirli bir öğede değiştirebilirsiniz.

                Tanım Listesi

                Tanımlar listesi, kelime makaleleri için tasarlandı.

                Genel bir konteyner 'DL' var. İçinde 'DT' (Tanım Terminali) ve 'DD' (Tanım Tanımı - Açıklama). En basit örnek:

                Pazarlama Bölümü

                Bu bölüm mal ve hizmetleri teşvik etmekle meşgul.

                Finans departmanı

                Bu bölüm tüm finansal işlemlerde bulunmaktadır.

                Tüm listelerin tüm unsurları blokdur. Ancak 'DT' unsurunun içinde sadece küçük harfler ayarlanabilir. 'DD' ve 'Li' unsurlarında bir şey koyabilirsiniz. Buradan iç içe geçmiş listeler var.

                Yuvalanmış (Karışık Listeler)

                Bunlar, içinde hiyerarşisi olan çok düzeyli listelerdir. Genellikle bu tür listeler bir site haritası oluştururken kullanılır. Misal:

                Karışık liste

                Günün Haberleri

                Bugün yağmur

                Yağmur bütün gün gidecek

                Gece Haberleri

                Geceleri yağmur yağacak

                Yarın yeni bir güne başlayacak