Welche neuen Tags wurden in HTML5 hinzugefügt?-H5-Tutorial-php.cn

Welche neuen Tags wurden in HTML5 hinzugefügt?

php中世界最好的语言

Freigeben： 2018-03-26 15:42:29

Original

3214 Leute haben es durchsucht

Dieses Mal werde ich Ihnen zeigen, was die neu hinzugefügten Tags von HTML5 sind und welche Vorsichtsmaßnahmen für die Verwendung der neu hinzugefügten Tags von HTML5 gelten. Das Folgende ist ein praktischer Fall, schauen wir uns das an.

Ich habe heute 9 neue Tags gelernt

< ;video> ist dasselbe wie das Audio-Tag. ist ein Video-Tag. Die wichtigsten häufig verwendeten Attribute sind die gleichen wie oben

Dies ist tatsächlich eine relativ große Verbesserung, weist jedoch auch Mängel auf. Dieses Tag kombiniert tatsächlich den „Text im

Eingabe-Tag “ und das Auswahl-Tag, um ein Eingabekombinationsfeld zu erstellen, das Eingabe- und Dropdown-Optionen ermöglicht . Der Nachteil besteht darin, dass die definierten Dropdown-Optionen nur dann wirksam werden, wenn das Eingabefeld leer ist, wenn es nicht über JS gesteuert wird.

Dieses Tag hat tatsächlich viele praktische Verwendungsmöglichkeiten und wird häufig zusammen mit dem Zusammenfassungs-Tag verwendet. Schreiben Sie den Titel des Dokuments in das Zusammenfassungs-Tag. Details zum Schreiben von Dokumenten mit dem p-Tag

Bei einem hervorgehobenen Anzeige-Tag müssen Sie das Schriftartattribut nicht mehr verwenden, um einen bestimmten Textabsatz zu markieren.

Erstellen Sie schnell eine Liste. Die Verwendung besteht darin, Menü li mit

zu kombinieren, dem Label, das die Adresse speichert

Dies ist ein

Fortschrittsbalken . Seine Hauptattribute sind Wert und max. value stellt die aktuelle Position des Fortschrittsbalkens dar und max stellt die Gesamtlänge des Fortschrittsbalkens dar.

-Tag enthält das Zeit-Tag.

Erster Kontakt mit HTML5-Tags. Der erste Eindruck, den Sie bekommen, ist, dass Sie wissen, was der Text bedeutet. Dieses Etikett ist leicht zu merken.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Html5学习之路</title>
</head>
<body>
<header style="text-align: center; color: blue;">欢迎来到Html5的学习之路，我是header标签。</header>
这是一个定义选项列表的标签datalist 这个的作用就是将text文本框与select标签结合起来
<input type="text" list="phone">
<datalist id="phone">
    <option></option>
    <option>IPhone</option>
    <option>华为    </option>
    <option>小米    </option>
    <option>三星</option>
</datalist>
<br/>
<br/>
<font color="red">这里我发现了两者一个不同之处在于，datalist只有在输入框为空的时候才会有自己定义下拉的内容!</font>
<br/>
而这个select选项框是不管什么内容它都会存在的
<select>
    <option>IPhone</option>
    <option>华为    </option>
    <option>小米    </option>
    <option>三星</option>
</select>
<br>
<br>
<br>
------------------------
<br><br><br>
这是一个定义文档细节的标签。detail标签。它的主要作用很简单。
<details>
    <summary>这是一个detail标签，下面就是他的使用方法</summary>
        <p>detail标签是什么？</p>
        <p>detail标签有什么作用？</p>
        <p>detail标签能干什么？</p>
        <p>detail标签我改怎么用它？</p>
</details>
<br>
detail标签常与sunmmary标签用在一起。比如这个标签是高亮标签<mark>mark</mark>比重不一样。
<br><br>
接下来这个标签是定义列表标签。menu。
<menu>
    <li>西游记</li><li>水浒传</li><li>红楼梦</li><li>三国演义</li>
</menu>
<br><br>
进度条标签我们用的比较多。比如这个。<mark>progress</mark>
<progress value="5" max="10">value=5 max=10</progress>
<br>
<audio src="" controls="controls" autoplay="autoplay" loop="loop"></audio>
<footer>我是底部footer标签</footer>
</body>
</html>

Nach dem Login kopieren

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website.

Empfohlene Lektüre:

So verwenden Sie Phonegap, um Kontakte zu finden

Detaillierte Erklärung der Phonegap-Audiowiedergabe

Das obige ist der detaillierte Inhalt vonWelche neuen Tags wurden in HTML5 hinzugefügt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!