Heim >Web-Frontend >H5-Tutorial >Neue Funktionen von HTML5 (1) _HTML5-Tutorial-Fähigkeiten

Neue Funktionen von HTML5 (1) _HTML5-Tutorial-Fähigkeiten

WBOY
WBOYOriginal
2016-05-16 15:45:391804Durchsuche

HTML5 ist eine Standardversion von HTML [1] (eine Anwendung unter der Standard Universal Markup Language), die die 1999 formulierten Standards HTML 4.01 und XHTML 1.0 ersetzt; sie befindet sich noch in der Entwicklungsphase, wird aber von den meisten Browsern bereits unterstützt Bestimmte HTML5-Technologien.

1. Neue Dokumenttypdeklaration
Die drei von HTML4 angegebenen Dokumenttypdeklarationen:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. >
  2. >
  3. >

Die drei von XHTML 1.0 spezifizierten Dokumenttypdeklarationen:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. > 
  2. >
  3. >

Das XHTML 1.1-Dokument definiert den Typ streng, was dem Übergangsdefinitionstyp des XHTML1.0-Dokuments entspricht

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. >

Dokumenttypdeklaration für HTML 5

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. >

2. Es ist nicht erforderlich, Skript und Link einzugeben

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <link rel=“stylesheet“ href=“path/to/stylesheet.css“ type=“text/css“ />   == 》  <link rel=“stylesheet“ href=“path/to/stylesheet.css“/>  
  2. <script src=“path/to/script.js“ type=“text/javascript“>script> ;    ==》  <script src=“path/to/ script.js“>script>  

3. 语义化header和footer标签
在HTML4或XHTML里,我们定义网页的页眉或页脚时会这样:

XML/HTML-Code复制内容到剪贴板
  1. <div id=“header“>  
  2. …   
  3. div>  
  4. 或   
  5. <div id=“footer“ >  
  6. …   
  7. div>  

而在HTML5里有直接定义上面元素块的标签,可以使代码更加的简洁和语义化

XML/HTML-Code复制内容到剪贴板
  1. <Kopfzeile>  
  2. …   
  3. Header>  
  4. 或   
  5. <Fußzeile>  
  6. …   
  7. Fußzeile>  

4. hgroup标签,它主要是表明标题的集合。如果有主标题、副标题,可以用这个来包裹一下。但是这个标签没什么大的用处, 在最新的HTML5.1版中被废除了
使用标点符号分割,一般适合于文章标题,不太适合网站标题.

XML/HTML-Code复制内容到剪贴板
  1. <h1>Frontend-Testfragen: Neue Funktionen von HTML5< /h1>

Verwenden Sie Span-Tags, um Untertitelbeschreibungen zu markieren

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <h1>Front-End-Testfragen
  2.  <span>Neue Funktionen von HTML5span>
  3. h1>

Verwenden Sie Header-Tags, um den Titel und die Beschreibung einzuschließen

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <Kopfzeile>
  2.  <h1>Front-End-Testfragenh1> 
  3.  <p>Neue Funktionen von HTML5p>
  4. Kopfzeile>

5. Elementmarkierung markieren

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. Das Element <Markierung> stellt eine Textzeile in einem Dokument dar, die mit oder gekennzeichnet ist zu Referenzzwecken hervorgehoben, da es in einem anderen Kontext relevant ist

kann als Hervorhebungs-Tag verwendet werden und die darin eingeschlossenen Zeichen werden hervorgehoben.
6. Grafikelementfigur
In HTML4 oder XHTML werden die folgenden Codes verwendet, um die Kommentare des Bildes zu dekorieren .

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <img src=“path/to/image“ alt=“Über Bild“/>
  2. <p>Bild einer Blume p>

Der obige Code verbindet keinen Text- und Bildspeicher, aber die von HTML5 hinzugefügte Kombination aus Abbildung und Bildunterschrift kann Bilder und Text perfekt verbinden.

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <Abbildung>
  2. <img src=“path/to/image“ alt=“Über das Bild“/>
  3. <figcaption>
  4.  <p>schöne Blumep> 
  5. <figcaption>
  6. Abbildung>

7. Das kleine Tag
Das -Tag stellt Marginalien als kleinen Text dar, der für Erklärungen, Vorsichtsmaßnahmen, rechtliche Einschränkungen oder deklarierte Versionen verantwortlich ist sind normalerweise kleine Texte.
Small wurde in HTML4 oder XHTML definiert, es gibt jedoch keine vollständige Erklärung seiner Verwendung. In HTML wird es hauptsächlich für kleine Texte wie Versionsanweisungen und E-Mail-Adressen am Ende von Webseiten verwendet.
8. Platzhalter
Wenn wir in HTML4 oder XHTML eine Eingabeaufforderung anzeigen möchten, wenn das Eingabefeld leer ist, wird das Eingabefeld fokussiert Der Effekt des Verschwindens der Eingabeaufforderung kann nur mit js geschrieben werden. Der in HTML5 hinzugefügte Platzhalter erzielt diesen Effekt direkt.
Das Platzhalterattribut ist auf die folgenden anwendbar.

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <Eingabe Platzhalter=“text“>
Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn