Bringen Sie Ihnen Schritt für Schritt bei, wie Sie geordnete Listen und ungeordnete Listen zu HTML-Text hinzufügen (detaillierte Code-Erklärung).-HTML-Tutorial-php.cn

Bringen Sie Ihnen Schritt für Schritt bei, wie Sie geordnete Listen und ungeordnete Listen zu HTML-Text hinzufügen (detaillierte Code-Erklärung).

奋力向前

Freigeben： 2021-08-16 17:39:20

Original

7091 Leute haben es durchsucht

Im vorherigen Artikel „Ein Trick, um Ihnen beizubringen, wie Sie mit CSS Hintergrundbilder zu HTML-Schriftarten hinzufügen (Code-Sharing)“ habe ich Ihnen gezeigt, wie Sie mit CSS Hintergrundbilder zu HTML-Schriftarten hinzufügen. Im folgenden Artikel erfahren Sie, wie Sie geordnete Listen und ungeordnete Listen zu Text in HTML hinzufügen. Sehen wir uns an, wie das gemeinsam geht.

Bringen Sie Ihnen Schritt für Schritt bei, wie Sie geordnete Listen und ungeordnete Listen zu HTML-Text hinzufügen (detaillierte Code-Erklärung).

So fügen Sie eine geordnete und eine ungeordnete Liste zum HTML-Text hinzu

1 Öffnen Sie zuerst das HTML-Dokument, geben Sie und dann <code> ein. Dieser Artikel. nbsp;html>然后本文。

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>

</body>
</html>

Nach dem Login kopieren

2、这个标签<ul>叫做无序列表标签，如果咱们想用的话，它底下还得必须包含一个东西叫做<li>这两个标签，它们是配合着使用，通过给大家代码示例。

代码示例

<ul>
    <li>我喜欢吃苹果</li>
    <li>我喜欢吃西瓜</li>
    <li>我喜欢吃香蕉</li>
    <li>我喜欢吃火龙果</li>
</ul>

Nach dem Login kopieren

代码效果

Bringen Sie Ihnen Schritt für Schritt bei, wie Sie geordnete Listen und ungeordnete Listen zu HTML-Text hinzufügen (detaillierte Code-Erklärung).

无序列表<Li>可以有无限，所有其余的内容放在<li>里面就可以。

看看试试能不能把<a>标签放在li里面效果怎么样？我们一起看看吧

代码示例

<ul>
    <li>我喜欢吃苹果</li>
    <li>我喜欢吃西瓜</li>
    <li>我喜欢吃香蕉</li>
    <li>我喜欢吃火龙果</li>
    <li><a href="https://www.baidu.com/">我要打开百度</a></li>
</ul>

Nach dem Login kopieren

代码效果

Bringen Sie Ihnen Schritt für Schritt bei, wie Sie geordnete Listen und ungeordnete Listen zu HTML-Text hinzufügen (detaillierte Code-Erklärung).

结束出来，可以，但是在低级浏览器上不可以，OK 正常来说ul下面只能第1层，这个就是咱们无序列表的一个基本使用，接下来有序列表怎么做呢。

3、这个标签<ol>叫做有序列表标签，和<ul>做法一样，必须包含一个东西叫做li这两个标签，通过给大家代码示例。

代码示例

<ol>
    <li>我喜欢吃苹果</li>
    <li>我喜欢吃西瓜</li>
    <li>我喜欢吃香蕉</li>
    <li>我喜欢吃火龙果</li>
    <li><a href="https://www.baidu.com/">我要打开百度</a></li>
</ol>

Nach dem Login kopieren

代码效果

Bringen Sie Ihnen Schritt für Schritt bei, wie Sie geordnete Listen und ungeordnete Listen zu HTML-Text hinzufügen (detaillierte Code-Erklärung).

其实这两个基本玩了一下这个html里的两个比较重要的标签，还有一个叫做<ul> 一个叫做<ol>rrreee

2. Dieses Tag <ul> wird als ungeordnetes Listen-Tag bezeichnet. Wenn wir es verwenden möchten, muss es etwas namens <li> enthalten Tags werden zusammen verwendet, um Ihnen Codebeispiele zu geben.

Codebeispielrrreee

Codeeffekt🎜🎜 WeChat Screenshot_20210816160109.jpg

🎜🎜Ungeordnete Liste <li> kann unbegrenzt sein, der gesamte Rest des Inhalts wird in <li>. 🎜🎜Mal sehen, ob wir das <a>-Tag in li einfügen können. Was ist der Effekt? Werfen wir gemeinsam einen Blick darauf🎜🎜Codebeispiel🎜rrreee🎜Codeeffekt🎜🎜 WeChat Screenshot_20210816160853.jpg

🎜🎜Das Ende kommt heraus, ja, aber nicht auf Low-Level-Browsern, OK. Normalerweise ist ul Unten ist nur die erste Ebene verfügbar. Dies ist eine grundlegende Verwendung unserer ungeordneten Liste. 🎜🎜3. Dieses Tag <ol> wird als geordnetes Listen-Tag bezeichnet. Es ist dasselbe wie <ul>. Es muss zwei Tags namens li enthalten Geben Sie Codebeispiele. 🎜🎜Codebeispiel🎜rrreee🎜Codeeffekt🎜🎜 WeChat Screenshot_20210816161438.jpg

🎜🎜Tatsächlich haben diese beiden im Grunde genommen mit zwei wichtigen Tags in diesem HTML gespielt, und es gibt noch ein weiteres namens

<ul> Einer heißt <ol> Der eine heißt ungeordnete Liste und der andere heißt geordnete Liste. Jeder muss aufpassen, da die grundlegenden Methoden konsistent sind. 🎜🎜Empfohlenes Lernen: 🎜Html-Video-Tutorial🎜🎜

Das obige ist der detaillierte Inhalt vonBringen Sie Ihnen Schritt für Schritt bei, wie Sie geordnete Listen und ungeordnete Listen zu HTML-Text hinzufügen (detaillierte Code-Erklärung).. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!