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

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

May 16, 2016 pm 03:45 PM

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“>
Erklärung dieser Website
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

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

So führen Sie das H5 -Projekt aus So führen Sie das H5 -Projekt aus Apr 06, 2025 pm 12:21 PM

Ausführen des H5 -Projekts erfordert die folgenden Schritte: Installation der erforderlichen Tools wie Webserver, Node.js, Entwicklungstools usw. Erstellen Sie eine Entwicklungsumgebung, erstellen Sie Projektordner, initialisieren Sie Projekte und schreiben Sie Code. Starten Sie den Entwicklungsserver und führen Sie den Befehl mit der Befehlszeile aus. Vorschau des Projekts in Ihrem Browser und geben Sie die Entwicklungsserver -URL ein. Veröffentlichen Sie Projekte, optimieren Sie Code, stellen Sie Projekte bereit und richten Sie die Webserverkonfiguration ein.

Was genau bedeutet H5 -Seitenproduktion? Was genau bedeutet H5 -Seitenproduktion? Apr 06, 2025 am 07:18 AM

Die Produktion von H5-Seiten bezieht sich auf die Erstellung von plattformübergreifenden kompatiblen Webseiten unter Verwendung von Technologien wie HTML5, CSS3 und JavaScript. Sein Kern liegt im Parsingcode des Browsers, der Struktur-, Stil- und interaktive Funktionen macht. Zu den allgemeinen Technologien gehören Animationseffekte, reaktionsschnelles Design und Dateninteraktion. Um Fehler zu vermeiden, sollten Entwickler debuggen werden. Leistungsoptimierung und Best Practices umfassen Bildformatoptimierung, Anforderungsreduzierung und Codespezifikationen usw., um die Ladegeschwindigkeit und die Codequalität zu verbessern.

So erstellen Sie H5 -Klicksymbol So erstellen Sie H5 -Klicksymbol Apr 06, 2025 pm 12:15 PM

Zu den Schritten zum Erstellen eines H5 -Klicksymbols gehören: Vorbereitung eines quadratischen Quellenbildes in der Bildbearbeitungssoftware. Fügen Sie die Interaktivität in den H5 -Editor hinzu und legen Sie das Klickereignis fest. Erstellen Sie einen Hotspot, der das gesamte Symbol abdeckt. Stellen Sie die Aktion von Klickereignissen fest, z. B. zum Springen zur Seite oder zum Auslösen von Animationen. Exportieren Sie H5 als HTML-, CSS- und JavaScript -Dateien. Stellen Sie die exportierten Dateien auf einer Website oder einer anderen Plattform ein.

Was ist die H5 -Programmiersprache? Was ist die H5 -Programmiersprache? Apr 03, 2025 am 12:16 AM

H5 ist keine eigenständige Programmiersprache, sondern eine Sammlung von HTML5, CSS3 und JavaScript zum Erstellen moderner Webanwendungen. 1. HTML5 definiert die Webseitenstruktur und -inhalt und bietet neue Tags und APIs. 2. CSS3 steuert Stil und Layout und führt neue Funktionen wie Animation ein. 3. JavaScript implementiert dynamische Interaktion und verbessert Funktionen durch DOM -Operationen und asynchrone Anfragen.

Welche Anwendungsszenarien eignen sich für die H5 -Seitenproduktion Welche Anwendungsszenarien eignen sich für die H5 -Seitenproduktion Apr 05, 2025 pm 11:36 PM

H5 (HTML5) eignet sich für leichte Anwendungen wie Marketingkampagnen, Produktdisplayseiten und Micro-Websites für Unternehmenswerbung. Seine Vorteile liegen in plattformartigen und reichhaltigen Interaktivität, aber seine Einschränkungen liegen in komplexen Interaktionen und Animationen, lokalen Ressourcenzugriff und Offline-Funktionen.

Worauf bezieht sich H5? Erforschen des Kontextes Worauf bezieht sich H5? Erforschen des Kontextes Apr 12, 2025 am 12:03 AM

H5REFERSTOHTML5, ApivotaltechnologyInwebdevelopment.1) HTML5IntroducesNewelementsandapisrich, Dynamicwebapplications.2) ITSUPP ortsmultimediaWitHoutPlugins, BETHINGINGUSEREXPERICERCROSSDEVICES.3) SEMANTICELEMENTSIMPROVEPENTENTENTENTRUCTENTRUCTELUREANDSEO.4) H5'SRespo

Ist die H5-Seitenproduktion eine Front-End-Entwicklung? Ist die H5-Seitenproduktion eine Front-End-Entwicklung? Apr 05, 2025 pm 11:42 PM

Ja, die H5-Seitenproduktion ist eine wichtige Implementierungsmethode für die Front-End-Entwicklung, die Kerntechnologien wie HTML, CSS und JavaScript umfasst. Entwickler bauen dynamische und leistungsstarke H5 -Seiten auf, indem sie diese Technologien geschickt kombinieren, z. B. die Verwendung der & lt; canvas & gt; Tag, um Grafiken zu zeichnen oder JavaScript zu verwenden, um das Interaktionsverhalten zu steuern.

H5 -Code: Zugänglichkeit und semantische HTML H5 -Code: Zugänglichkeit und semantische HTML Apr 09, 2025 am 12:05 AM

H5 verbessert die Zugänglichkeits- und SEO -Effekte der Webseiten durch semantische Elemente und Aria -Attribute. 1. Verwendung usw., um die Inhaltsstruktur zu organisieren und SEO zu verbessern. 2. ARIA-Attribute wie ARIA-Label verbessern die Zugänglichkeit, und assistive Technologie-Benutzer können Webseiten reibungslos verwenden.

See all articles