Senarai Tertib HTML

Dalam bahagian ini, kita akan belajar cara melaksanakan Senarai Tertib dalam HTML. Bagaimana untuk menerangkan atau memaparkan senarai tersusun? Ia sangat mudah dan mudah; ia digunakan untuk menerangkan senarai maklumat dalam kandungan. Dan teknik lain ialah satu senarai boleh mempunyai berbilang elemen senarai padanya.

Senarai dalam HTML boleh dikelaskan kepada tiga jenis, iaitu:

1. Senarai Tertib
2. Senarai tidak tersusun
3. Senarai Definisi

Dalam artikel ini, kita akan meneliti spesifikasi senarai tersusun dengan contoh. Senarai tertib mentakrifkan maklumat tertib khusus apabila senarai dibuat; contohnya, ia menunjukkan maklumat selaras atau menomborkan maklumat.

Sintaks Senarai Tertib

Senarai tertib dibuat menggunakan teg bernama

elemen dan berakhir dengan

tag.

Contoh Senarai Tertib

Mari kita lihat beberapa contoh yang disebut di bawah:

Contoh #1

<title>HTML Ordered List</title>


<p><strong>There are 6 different airlines:</strong></p>
<ol type="1">
<li>Jet Blue Airlines</li>
<li>Frontier Airlines</li>
<li>South West Airlines</li>
<li> Spirit Airlines</li>
<li> United Airlines</li>
<li>America Airlines</li> </ol>

Output:

Ini akan memberikan anda hasil seperti

Contoh #2

Senarai Tempahan dengan warna. Dalam contoh berikut, kami telah menggunakan sifat balas tertentu, mentakrifkan item senarai pengiraan automatik dalam

. Ia hanyalah pembolehubah dalaman CSS untuk membolehkan fungsi mengira.

<title>HTML Ordered List with colors</title>


<style>
ol li {
counter-increment: list;
list-style-type: none;
position: relative;
}
ol li:before {
color: #ff0000;
content: counter(list) ".";
left: -22px;
position: absolute;
text-align: center;
width: 24px;
}</style>
<ol>
<li><span> Norway is a Scandinavian Country</span></li>
<li><span>Oslo is the capital city</span></li>
<li><span>norway is known for its beauty , hiking, fishing</span></li>
<li><span>Ranked among the toppest country in europe</span></li>
</ol><br>

Output:

Jenis Atribut untuk Senarai Tertib HTML

Untuk mewakili senarai tertib, terdapat lima jenis atribut penting untuk teg ini. Sebagai HTML

tag mewakili senarai item dalam senarai tersusun, ia boleh sama ada dalam susunan abjad angka, angka atau hanya abjad, dengan syarat susunan adalah perkara utama. Berikut ialah atribut yang mungkin bagi senarai Tertib:

1. Atribut Jenis

Atribut ini memberikan jenis penomboran yang akan digunakan dalam senarai.

• jenis =’a’ – Memberi susunan abjad
• jenis =’A’- Memberi susunan Abjad huruf besar
• jenis =’i’ – Memberi huruf kecil nombor Roman
• jenis =’ I’- Memberi nombor Roman huruf besar

Jenis penomboran ini disebut di bawah:

Saya.  Jenis atribut=’a.’

Untuk membuat senarai dalam huruf kecil abjad, jenis ini digunakan. Contoh berikut menunjukkan senarai tertib dalam huruf kecil dan menjadikannya dalam huruf condong.

Contoh:

<title>HTML Ordered List types</title>


<style>
ol li span {
font-weight: normal;
}
</style>
<p>Did you know that:</p>
<p>Skills required to become a data Scientist</p>
<ol type="a">
<li><span><i> steps</i></span></li>
<li><span><b>There should be a prior knowledge in SAS and R programming.</b></span></li>
<li>
<span><b>They should have a strong calibre in creativity and analysis</b></span><b></b>
</li>
</ol>

Output:

 II. Jenis atribut=’A.’

Senarai tersusun boleh mempunyai jenis atribut huruf kecil abjad. Contoh di bawah menunjukkan cara menggunakan atribut ini dalam struktur senarai dan juga cara membuat huruf tebal. Untuk mempunyai senarai tertib dalam huruf tebal, ia hendaklah diisytiharkan menggunakan

Contoh:

<title> Example for Nested list</title>


<p> State capitals of the united States</p>
<style>
ol {
font-weight:bolder;
}
ol li span {
font-weight: normal;
}
</style>
<ol type="A">
<li> <span>Alabama
<ul>
<li>Montgomery</li>
</ul>
</span>
</li>
<li>
<span>Arizona
<ul>
<li>Phoenix</li>
</ul>
</span>
</li>
<li> <span>California
<ul>
<li>Sacramento</li>
</ul>
</span>
</li>
<li> <span>New jersey
<ul>
<li>Trenton</li>
</ul>
</span>
</li>
<li>
<span>Washington
<ul>
<li>Olympia</li>
</ul></span>
</li>
<li> <span>Pennsylvannia
<ul>
</ul></span> </li>
<li>Harisburg</li>
</ol>

Output:

III. Jenis atribut=’i.’

Kefungsian ini menunjukkan huruf kecil rumi.

Contoh:

<title>HTML Ordered List types</title>


<p> EDUCBA HTML List Tutorial:</p>
<ol>
<li value="4">Ordered list</li>
<li>unordered list</li>
<li>Definition list
<ol type="i">
<li> <i>Introduction to list </i>
</li>
<li><i>Syntax a List</i></li>
<li>
<i> Types with an example</i>
</li>
</ol>
</li>
<li>Snapshots</li>
</ol>

Output:

IV. Jenis atribut=’ I.’

Kefungsian ini memberikan output dalam Angka Rom Atas.

Contoh:

<title>HTML Ordered List Demo</title>


<h2> List of Vegetables
<ol type="I">
<li>Carrot</li>
<li> Radish</li>
<li> Sweet Corn</li>
</ol>
<ol>
<li>Fruits List
<ol type="a">
<li>Pomegrante</li>
<li>Bananas</li>
<li>Pears</li>
</ol>
</li>

</ol>
</h2>

Output:

2. Atribut Mula

Atribut mula mentakrifkan nilai mula untuk nombor senarai tersusun. Anda boleh bermula dengan mana-mana nombor dari awal, bukan hanya dari nombor lalai '1'. Contoh: mula=6. Ia telah digunakan sekarang dalam HTML5.

Contoh:

Dalam contoh berikut, saya telah menggunakan jenis gaya kepada upper_alpha bersama-sama dengan permulaan daripada =3; oleh itu, output ditunjukkan daripada 'C'.

<title> Example for Nested list</title>


<p> RICHEST COUNTRIES IN THE WORLD</p>
<style>
ol { list-style-type: upper-alpha;
font-weight:bolder;
}
ol li span {
font-weight: normal;}
</style>
<ol start="3">
<li>Quatar known for his oil and petrochemical reserves</li>
<li>Norway known for the beauty of nature with petroleum producer</li>
<li>Singapore with global trade center</li>
</ol>

Output: 

3. Atribut Songsang

Ini ialah atribut baharu yang diperkenalkan dalam HTML5, yang menunjukkan item dipaparkan dalam susunan terbalik dalam penyemak imbas web. Untuk menggunakan,

ia adalah atribut Boolean yang mengambil sebarang nilai padanya untuk membalikkan pembilang. Diisytiharkan
dalam
tag.

Contoh:

<title>HTML Ordered List</title>


<h2 id="How-to-do-Balle-Technique">How to do Balle Technique</h2>
<ol>
<li>Turn out</li>
<li>Alignment</li>
<li>Pointed Toes</li>
</ol>
<hr>
<h2 id="Balle-Steps"> Balle Steps</h2>
<ol reversed="True">
<li>Seven Movements</li>
<li>Plier</li>
<li>Etendre </li>
<li>Glisser</li>
<li>Eliever</li>
</ol>

Output:



Conclusion

Par conséquent, j'ai résumé ce que la liste ordonnée a fait jusqu'à la fin, et elle est presque prise en charge dans tous les navigateurs. Bien entendu, vous pouvez créer n'importe quel nombre de listes dans l'élément de balise HTML ; dans cet article, nous nous sommes simplement concentrés sur des exemples sélectionnés pour comprendre l'implémentation de base. Ainsi, l'apprentissage de ce sujet n'est peut-être pas la tâche la plus difficile, car le

1. la balise utilisée ici est très simple à retenir.

Atas ialah kandungan terperinci Senarai Tertib HTML. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!