Wenn Sie den obigen Code in eine .html -Datei einfügen, haben Sie eine Webseite! Diese grundlegende HTML5 -Vorlage enth?lt einige der im n?chsten Abschnitt aufgeführten Elemente sowie ein einfaches Titelelement, das in Ihrem Webbrowser angezeigt wird. <\/p>\n
Schauen wir uns seine Struktur genauer an. <\/p>\n
Struktur der HTML5 -Vorlage <\/strong> <\/p>\n
HTML -Vorlagen enthalten normalerweise die folgenden Teile: <\/p>
\n
Dokumenttyperkl?rung (oder docType) <\/li>\n
<\/code> Element <\/li>\n
Zeichenkodierung <\/li>\n
Ansichtsfenster -Element <\/li>\n
<\/code>, Beschreibung und Autor <\/li>\n<li> Grafikelement für soziale Karten ?ffnen <\/li>\n<li> Favicon und Touch -Symbole <\/li>\n<li> CSS Stylesheet Link <\/li>\n<li> JavaScript -Datei -Link <\/li>\n<\/ol>\n<p> Zus?tzlich zu den Deklarationen und Elementen von Dokumenttypen <code><html><\/code> finden sich die meisten der oben aufgeführten Elemente im Abschnitt <code><head><\/code> der HTML -Vorlage. <\/p>\n<p> <strong> HTML5 Dokumenttyp Anweisung <\/strong> <\/p>\n<p> Ihre HTML5 -Vorlage muss mit einer Deklaration von Dokumenttypen oder <em> docType <\/em> beginnen. docType ist nur eine M?glichkeit, den Browser oder einen anderen Parser mitzuteilen, welche Art von Dokument er betrachtet. Für HTML -Dateien bedeutet dies eine bestimmte Version und Art von HTML. docType sollte immer der erste Element oben in jeder HTML -Datei sein. Vor vielen Jahren war die DocType -Erkl?rung eine h?ssliche und schwer zu erinnerne Verwirrung, die normalerweise als \"xhtml streng\" oder \"html transitional\" bezeichnet wurde. <\/p>\n<p> Mit dem Aufkommen von HTML5 verschwanden diese unverst?ndlichen nervigen Dinge, und jetzt brauchen Sie nur Folgendes: <\/p>\n<pre class='brush:php;toolbar:false;'><!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n <title>HTML5 Boilerplate<\/title>\n <link rel=\"stylesheet\" href=\"styles.css\">\n<\/head>\n<body>
<h1><a href="http://miracleart.cn/">国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂</a></h1>\n <h1>Page Title<\/h1>\n <??>\n<\/body>\n<\/html><\/pre>\n<p> Einfach und klar. \"5\" verschwand deutlich aus der Aussage. Obwohl die aktuelle Version des Web -Tags als \"HTML5\" bezeichnet wird, ist sie wirklich nur eine Entwicklung früherer HTML -Standards - die zukünftigen Spezifikationen werden nur die Entwicklung sein, die wir heute haben. Es wird niemals \"HTML6\" geben, daher wird das Web -Tag des aktuellen Status normalerweise einfach \"HTML\" bezeichnet. <\/p>\n<p> Da der Browser alte Inhalte im Web unterstützen muss, beruht er nicht auf docType, um dem Browser mitzuteilen, welche Funktionen in einem bestimmten Dokument unterstützt werden sollten. Mit anderen Worten, nur docType macht Ihre Seite nicht mit modernen HTML -Funktionen einverstanden. Tats?chlich bestimmt der Browser unabh?ngig vom verwendeten DocType den Merkmalsunterstützungsfall nach Fall. Tats?chlich k?nnen Sie den alten DocType mit dem neuen HTML5 -Element auf der Seite verwenden, und die Seite macht genauso wie bei der Verwendung des neuen DocType. <\/p>\n<p> <strong> <code><html><\/code> Element <\/strong> <\/p>\nDas Element <p> <code><html><\/code> ist das Element der obersten Ebene in einer HTML -Datei - was bedeutet, dass es alles au?er DocType im Dokument enth?lt. Das <code><html><\/code> -Element ist in zwei Teile unterteilt: <code><head><\/code> und <code><body><\/code> Teile. Alle anderen Inhalte in der Webseitendatei werden in oder im <code><html><\/code> -Element platziert. Der folgende Code zeigt das <code><html><\/code> -Element, das sich nach der DocType -Deklaration befindet und die Elemente <code><html><\/code> und <code><head><\/code> enth?lt: <code><body><\/code>\n<\/p>\n<pre class='brush:php;toolbar:false;'><!DOCTYPE html><\/pre> <p> wie man Tags in html <strong> <\/strong> verwendet\nDer Abschnitt <\/p> <p> enth?lt wichtige Informationen zum Dokument, das nicht dem Endbenutzer angezeigt wird - z. B. Zeichenkodierung und Links zu CSS -Dateien und m?glicherweise JavaScript -Dateien. Diese Informationen werden von Maschinen wie Browsern, Suchmaschinen und Bildschirmlesern verwendet: <code><head><\/code>\n<\/p>\nAlle Elemente, die zwischen den obigen <pre class='brush:php;toolbar:false;'><html lang=\"en\">\n <head>\n <\/head>\n <body>\n <\/body>\n<\/html><\/pre>… <p> -Tags enthalten sind, sind wichtig, aber Endbenutzer sehen es nicht - mit Ausnahme des Textes <code><head><\/code>, es wird in Online -Such- und Browser -Tags angezeigt. <code><\/head><\/code><p> <strong> wie man Tags in html <\/strong> <\/p> verwendet\nDer Abschnitt <p> <code><body><\/code> enth?lt alles, was im Browser angezeigt wird - z. B. Text, Bilder usw. Wenn Sie dem Endbenutzer etwas anzeigen m?chten, stellen Sie sicher, dass Sie es zwischen ein und aus <code><body><\/code>… <code><\/body><\/code> Tags: <\/p> platzieren: <pre class='brush:php;toolbar:false;'><!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n <title>HTML5 Boilerplate<\/title>\n <link rel=\"stylesheet\" href=\"styles.css\">\n<\/head>\n<body>\n <h1>Page Title<\/h1>\n <??>\n<\/body>\n<\/html><\/pre>\n<p>\n<img src=\"https:\/\/img.php.cn\/upload\/article\/000\/000\/000\/173897581228837.jpg\" alt=\"HTML5 Template: A Base Starter HTML Boilerplate for Any Project \" \/> <\/p> <p>\n<strong> <code>lang<\/code> <\/strong> Was sind die Attribute? <\/p> <p>\nDas <code><html><\/code> <code>lang<\/code> Element sollte idealerweise das Attribut <code><html lang=\"en\"><\/code> enthalten, wie im obigen Code (<\/p>) gezeigt. Sein Hauptzweck ist es, assistierende Technologien wie Bildschirmleser zu erz?hlen, wie sie beim Vorlesen sie aussprechen. (Diese Eigenschaft ist für die Seitenüberprüfung nicht erforderlich, aber die meisten Validatoren geben Warnungen aus, wenn Sie sie nicht einschlie?en.) <p>\n<code>lang<\/code> Der oben gezeigte Wert des oben gezeigten <code>en<\/code> -attributs ist <code>fr<\/code>, wodurch das Dokument in englischer Sprache geschrieben ist. Alle anderen gesprochenen Sprachen haben Werte wie <code>de<\/code> in Franz?sisch, <code>hi<\/code> in Deutsch, <\/p> in Hindi usw. (Sie finden eine vollst?ndige Liste von Sprachcodes auf Wikipedia.) <p>\n<strong> <\/strong> HTML -Dokument Zeichenkodierung <\/p> <p>\nDie erste Zeile im Abschnitt <code><head><\/code> HTML -Dokument <\/p> ist die Zeile, die die Zeichencodierung des Dokuments definiert. Die Buchstaben und Symbole, die wir auf Webseiten lesen, werden als eine Reihe von Zahlen definiert, und einige Zeichen (z. B. Buchstaben) werden in vielerlei Hinsicht codiert. Daher ist es nützlich, Ihren Computer mitzuteilen, auf welche Codierung Ihre Webseite sich beziehen sollte. Anzeigencharaktercodierung ist eine optionale Funktion, die keine Warnungen im Validator hervorruft. Auf den meisten HTML -Seiten wird jedoch empfohlen: <pre class='brush:php;toolbar:false;'><!DOCTYPE html><\/pre>\n<p>\n<em> <code><title><\/code> Hinweis: Um sicherzustellen, dass einige ?ltere Browser die Charakter -Codierung korrekt lesen, muss die gesamte Erkl?rung für die Codierungskodierung von Charakteren irgendwo in die ersten 512 Zeichen des Dokuments aufgenommen werden. Es sollte auch vor einem inhaltsbasierten Element angezeigt werden (wie das <\/em> -Element, das sp?ter in unserem Beispiel angezeigt wird). <\/p> <h3>\n<\/h3> Warum verwenden Sie die UTF-8-Zeichencodierung in HTML5-Vorlagen? <p>\n<code>utf-8<\/code> Das obige Zeichen-Codierungsbeispiel verwendet den UTF-8-Zeichensatz. In fast allen F?llen ist <\/p> der Wert, den Sie in Ihrem Dokument verwenden sollten. Diese Codierung deckt verschiedene Zeichen ab, die nicht in anderen Codierungen enthalten sind. M?glicherweise haben Sie beispielsweise auf seltsame Charaktere im Web gesto?en, was offensichtlich ein Fehler ist. Dies liegt normalerweise daran, dass der Browser die erwarteten Zeichen in dem im Dokument angegebenen Zeichensatz nicht finden kann. <p>\n<\/p> UTF-8 deckt eine Vielzahl von Charakteren ab, darunter viele Charaktere in verschiedenen Sprachen auf der ganzen Welt sowie viele nützliche Symbole. Wie die World Wide Web Alliance erkl?rt: <blockquote>\n<p>\n<\/p> Unicode-basierte Codierungen (z. B. UTF-8) k?nnen mehrere Sprachen unterstützen und an alle Sprachmischseiten und -formen angepasst werden. Die Verwendung kann auch die serverseitige Logik beseitigen, wodurch die Zeichenkodierung für jede Serviceseite oder für jede Einreichungsformulareingabe individuell bestimmt wird. Dies verringert die Komplexit?t der Umgang mit mehrsprachigen Websites oder Anwendungen erheblich.
<meta http-equiv="Cache-Control" content="no-transform" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<script>var V_PATH="/";window.onerror=function(){ return true; };</script>
</head>
<body data-commit-time="2023-12-28T14:50:12+08:00" class="editor_body body2_2">
<link rel="stylesheet" type="text/css" href="/static/csshw/stylehw.css">
<header>
<div id="377j5v51b" class="head">
<div id="377j5v51b" class="haed_left">
<div id="377j5v51b" class="haed_logo">
<a href="http://miracleart.cn/de/" title="" class="haed_logo_a">
<img src="/static/imghw/logo.png" alt="" class="haed_logoimg">
</a>
</div>
<div id="377j5v51b" class="head_nav">
<div id="377j5v51b" class="head_navs">
<a href="javascript:;" title="Gemeinschaft" class="head_nava head_nava-template1">Gemeinschaft</a>
<div class="377j5v51b" id="dropdown-template1" style="display: none;">
<div id="377j5v51b" class="languagechoose">
<a href="http://miracleart.cn/de/article.html" title="Artikel" class="languagechoosea on">Artikel</a>
<a href="http://miracleart.cn/de/faq/zt" title="Themen" class="languagechoosea">Themen</a>
<a href="http://miracleart.cn/de/wenda.html" title="Fragen und Antworten" class="languagechoosea">Fragen und Antworten</a>
</div>
</div>
</div>
<div id="377j5v51b" class="head_navs">
<a href="javascript:;" title="Lernen" class="head_nava head_nava-template1_1">Lernen</a>
<div class="377j5v51b" id="dropdown-template1_1" style="display: none;">
<div id="377j5v51b" class="languagechoose">
<a href="http://miracleart.cn/de/course.html" title="Kurs" class="languagechoosea on">Kurs</a>
<a href="http://miracleart.cn/de/dic/" title="Programmierw?rterbuch" class="languagechoosea">Programmierw?rterbuch</a>
</div>
</div>
</div>
<div id="377j5v51b" class="head_navs">
<a href="javascript:;" title="Tools-Bibliothek" class="head_nava head_nava-template1_2">Tools-Bibliothek</a>
<div class="377j5v51b" id="dropdown-template1_2" style="display: none;">
<div id="377j5v51b" class="languagechoose">
<a href="http://miracleart.cn/de/toolset/development-tools" title="Entwicklungswerkzeuge" class="languagechoosea on">Entwicklungswerkzeuge</a>
<a href="http://miracleart.cn/de/toolset/website-source-code" title="Quellcode der Website" class="languagechoosea">Quellcode der Website</a>
<a href="http://miracleart.cn/de/toolset/php-libraries" title="PHP-Bibliotheken" class="languagechoosea">PHP-Bibliotheken</a>
<a href="http://miracleart.cn/de/toolset/js-special-effects" title="JS-Spezialeffekte" class="languagechoosea on">JS-Spezialeffekte</a>
<a href="http://miracleart.cn/de/toolset/website-materials" title="Website-Materialien" class="languagechoosea on">Website-Materialien</a>
<a href="http://miracleart.cn/de/toolset/extension-plug-ins" title="Erweiterungs-Plug-Ins" class="languagechoosea on">Erweiterungs-Plug-Ins</a>
</div>
</div>
</div>
<div id="377j5v51b" class="head_navs">
<a href="http://miracleart.cn/de/ai" title="KI-Tools" class="head_nava head_nava-template1_3">KI-Tools</a>
</div>
<div id="377j5v51b" class="head_navs">
<a href="javascript:;" title="Freizeit" class="head_nava head_nava-template1_3">Freizeit</a>
<div class="377j5v51b" id="dropdown-template1_3" style="display: none;">
<div id="377j5v51b" class="languagechoose">
<a href="http://miracleart.cn/de/game" title="Spiel-Download" class="languagechoosea on">Spiel-Download</a>
<a href="http://miracleart.cn/de/mobile-game-tutorial/" title="Spiel-Tutorials" class="languagechoosea">Spiel-Tutorials</a>
</div>
</div>
</div>
</div>
</div>
<div id="377j5v51b" class="head_search">
<input id="key_words" onkeydown="if (event.keyCode == 13) searchs('de')" class="search-input" type="text" autocomplete="off" name="keywords" required="required" placeholder="Block,address,transaction,news" value="">
<a href="javascript:;" title="suchen" onclick="searchs('de')"><img src="/static/imghw/find.png" alt="suchen"></a>
</div>
<div id="377j5v51b" class="head_right">
<div id="377j5v51b" class="haed_language">
<a href="javascript:;" class="layui-btn haed_language_btn">Deutsch<i class="layui-icon layui-icon-triangle-d"></i></a>
<div class="377j5v51b" id="dropdown-template" style="display: none;">
<div id="377j5v51b" class="languagechoose">
<a href="javascript:setlang('zh-cn');" title="簡體中文" class="languagechoosea">簡體中文</a>
<a href="javascript:setlang('en');" title="English" class="languagechoosea">English</a>
<a href="javascript:setlang('zh-tw');" title="繁體中文" class="languagechoosea">繁體中文</a>
<a href="javascript:setlang('ja');" title="日本語" class="languagechoosea">日本語</a>
<a href="javascript:setlang('ko');" title="???" class="languagechoosea">???</a>
<a href="javascript:setlang('ms');" title="Melayu" class="languagechoosea">Melayu</a>
<a href="javascript:setlang('fr');" title="Fran?ais" class="languagechoosea">Fran?ais</a>
<a href="javascript:;" title="Deutsch" class="languagechoosea">Deutsch</a>
</div>
</div>
</div>
<span id="377j5v51b" class="head_right_line"></span>
<div style="display: block;" id="login" class="haed_login ">
<a href="javascript:;" title="Login" class="haed_logina ">Login</a>
</div>
<div style="display: block;" id="reg" class="head_signup login">
<a href="javascript:;" title="singup" class="head_signupa">singup</a>
</div>
</div>
</div>
</header>
<main>
<div id="377j5v51b" class="Article_Details_main">
<div id="377j5v51b" class="Article_Details_main1">
<div id="377j5v51b" class="Article_Details_main1L">
<div id="377j5v51b" class="Article_Details_main1Lmain" id="Article_Details_main1Lmain">
<div id="377j5v51b" class="Article_Details_main1L1">Inhaltsverzeichnis</div>
<div id="377j5v51b" class="Article_Details_main1L2" id="Article_Details_main1L2">
<!-- 左側(cè)懸浮，文章定位標(biāo)題1 id="Article_Details_main1L2s_1"-->
<div id="377j5v51b" class="Article_Details_main1L2s ">
<a href="#integrieren" title=" integrieren " > integrieren </a>
</div>
<div id="377j5v51b" class="Article_Details_main1L2s ">
<a href="#Integrieren-Sie-JavaScript-Dateien-in-HTML-Vorlagen" title=" Integrieren Sie JavaScript -Dateien in HTML -Vorlagen " > Integrieren Sie JavaScript -Dateien in HTML -Vorlagen </a>
</div>
<div id="377j5v51b" class="Article_Details_main1L2s ">
<a href="#Wofür-wird-die-HTML-Vorlage-verwendet" title=" Wofür wird die HTML5 -Vorlage verwendet? " > Wofür wird die HTML5 -Vorlage verwendet? </a>
</div>
<div id="377j5v51b" class="Article_Details_main1L2s ">
<a href="#Was-ist-das-Vorlage-Beispiel" title=" Was ist das Vorlage Beispiel? " > Was ist das Vorlage Beispiel? </a>
</div>
<div id="377j5v51b" class="Article_Details_main1L2s ">
<a href="#Was-ist-der-Startcode-für-HTML" title=" Was ist der Startcode für HTML? " > Was ist der Startcode für HTML? </a>
</div>
<div id="377j5v51b" class="Article_Details_main1L2s ">
<a href="#Ben?tigt-jede-HTML-Datei-eine-Vorlage" title=" Ben?tigt jede HTML -Datei eine Vorlage? " > Ben?tigt jede HTML -Datei eine Vorlage? </a>
</div>
</div>
</div>
</div>
<div id="377j5v51b" class="Article_Details_main1M">
<div id="377j5v51b" class="phpgenera_Details_mainL1">
<a href="http://miracleart.cn/de/" title="Heim"
class="phpgenera_Details_mainL1a">Heim</a>
<img src="/static/imghw/top_right.png" alt="" />
<a href="http://miracleart.cn/de/web-designer.html"
class="phpgenera_Details_mainL1a">Web-Frontend</a>
<img src="/static/imghw/top_right.png" alt="" />
<a href="http://miracleart.cn/de/css-tutorial.html"
class="phpgenera_Details_mainL1a">CSS-Tutorial</a>
<img src="/static/imghw/top_right.png" alt="" />
<span>HTML5 -Vorlage: Ein Basisstarter HTML -Boilerplate für jedes Projekt</span>
</div>
<div id="377j5v51b" class="Articlelist_txts">
<div id="377j5v51b" class="Articlelist_txts_info">
<h1 class="Articlelist_txts_title">HTML5 -Vorlage: Ein Basisstarter HTML -Boilerplate für jedes Projekt</h1>
<div id="377j5v51b" class="Articlelist_txts_info_head">
<div id="377j5v51b" class="author_info">
<a href="http://miracleart.cn/de/member/1468495.html" class="author_avatar">
<img class="lazy" data-src="https://img.php.cn/upload/avatar/000/000/001/66ea810373f2f131.png" src="/static/imghw/default1.png" alt="Joseph Gordon-Levitt">
</a>
<div id="377j5v51b" class="author_detail">
<a href="http://miracleart.cn/de/member/1468495.html" class="author_name">Joseph Gordon-Levitt</a>
</div>
</div>
</div>
<span id="377j5v51b" class="Articlelist_txts_time">Feb 08, 2025 am 08:50 AM</span>
</div>
</div>
<hr />
<div id="377j5v51b" class="article_main php-article">
<div id="377j5v51b" class="article-list-left detail-content-wrap content">
<ins class="adsbygoogle"
style="display:block; text-align:center;"
data-ad-layout="in-article"
data-ad-format="fluid"
data-ad-client="ca-pub-5902227090019525"
data-ad-slot="3461856641">
</ins>
<p> Erstellen Sie Ihre eigene HTML5 -Vorlage: eine kurze Anleitung </p>
<p> <img src="/static/imghw/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/173897581160448.jpg" class="lazy" alt="HTML5 Template: A Base Starter HTML Boilerplate for Any Project "> </p>
<p> In diesem Artikel wird Sie begleitet, wie Sie Ihre eigene HTML5 -Vorlage erstellen. Wir werden Schritt für Schritt die Schlüsselelemente der HTML -Basisvorlage erl?utern und schlie?lich eine einfache Vorlage bereitstellen, die Sie verwenden und weiter erstellen k?nnen. </p>
<p> Nach dem Lesen dieses Artikels haben Sie Ihre eigene HTML5 -Vorlage. Wenn Sie jetzt den HTML -Vorlagencode erhalten m?chten, lesen Sie diesen Artikel sp?ter, hier ist unsere letzte HTML5 -Vorlage. </p>
<p> <strong> Schlüsselpunkte </strong> </p>
<ul>
<li> HTML5 -Vorlagen als wiederverwendbare Vorlagen enthalten die erforderlichen HTML -Elemente und vermeiden Sie das Schreiben von wiederholtem Code zu Beginn jedes Projekts. </li>
<li> Eine grundlegende HTML5 -Vorlage sollte Dokumenttypdeklarationen, <code></code> Elemente mit Sprachattributen, Zeichencodierung über <code><meta charset="utf-8"></code> und Ansichtsfenster für reaktionsschnelles Design enthalten. </li>
Die Schlüsselelemente des Abschnitts <li> HTML5 -Vorlage <code></code> enthalten normalerweise Metadaten für SEO, Links zu CSS -Stylesheets und optionale JavaScript -Dateien. </li>
<li> Für die Optimierung in sozialen Medien kann das Hinzufügen offener Diagramm -Meta -Tags den Anzeigentffekt von Inhalten verbessern, wenn sie auf sozialen Plattformen gemeinsam genutzt werden. </li>
<li> einschlie?lich Favicon- und Apple -Touch -Symbole in der Vorlage hilft, die Markenidentit?t aufzubauen und die Benutzererfahrung über Ger?te hinweg zu verbessern. </li>
<li> JavaScript -Dateien vor geschlossenem <code></code> Tags k?nnen die Seitenladegeschwindigkeiten verbessern, da Browser die Seiten schneller rendern, indem das Ladungsskript verz?gert wird. </li>
</ul>
<p> <strong> Was ist eine HTML -Vorlage? </strong> </p>
<p> Jede Website ist anders, aber von einer Website zur anderen sind viele Dinge im Grunde gleich. Erstellen Sie Ihre eigene "Vorlage", anstatt immer wieder denselben Code zu schreiben. Eine Vorlage ist eine Vorlage, die Sie jedes Mal verwenden, wenn Sie ein Projekt starten, mit der Sie verhindern k?nnen, dass Sie von vorne anfangen. </p>
<p> Wikipedia beschreibt die Vorlage als: </p>
<blockquote>
<p> Code -Snippets werden wiederholt an mehreren Stellen angezeigt, wobei sich wenig ge?ndert hat. </p>
</blockquote>
<p> Wenn Sie HTML5 lernen und Ihrem Toolbox neue Technologien hinzufügen, m?chten Sie m?glicherweise eine HTML -Vorlage für sich selbst erstellen, um alle zukünftigen Projekte zu starten. Es lohnt sich auf jeden Fall, und es gibt viele Ausgangspunkte online, mit denen Sie Ihre eigenen HTML5 -Vorlagen erstellen k?nnen. </p>
<p> <strong> Ein sehr einfaches Beispiel für die HTML5 -Vorlage </strong> </p>
<p> Die vollst?ndige Vorlage am Ende dieses Artikels enth?lt viele Inhalte. Aber Sie müssen es nicht so schick machen - besonders wenn Sie gerade erst lernen, zu lernen. Hier ist eine sehr einfache "Anf?nger" -HTML5 -Vorlage, die wahrscheinlich das einzige ist, was Sie brauchen: </p>
<pre class='brush:php;toolbar:false;'><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HTML5 Boilerplate</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Page Title</h1>
<??>
</body>
</html></pre>
<p> Wenn Sie den obigen Code in eine .html -Datei einfügen, haben Sie eine Webseite! Diese grundlegende HTML5 -Vorlage enth?lt einige der im n?chsten Abschnitt aufgeführten Elemente sowie ein einfaches Titelelement, das in Ihrem Webbrowser angezeigt wird. </p>
<p> Schauen wir uns seine Struktur genauer an. </p>
<p> <strong> Struktur der HTML5 -Vorlage </strong> </p>
<p> HTML -Vorlagen enthalten normalerweise die folgenden Teile: </p><ol>
<li> Dokumenttyperkl?rung (oder docType) </li>
<li> <code><html></code> Element </li>
<li> Zeichenkodierung </li>
<li> Ansichtsfenster -Element </li>
<li> <code><title></code>, Beschreibung und Autor </li>
<li> Grafikelement für soziale Karten ?ffnen </li>
<li> Favicon und Touch -Symbole </li>
<li> CSS Stylesheet Link </li>
<li> JavaScript -Datei -Link </li>
</ol>
<p> Zus?tzlich zu den Deklarationen und Elementen von Dokumenttypen <code><html></code> finden sich die meisten der oben aufgeführten Elemente im Abschnitt <code><head></code> der HTML -Vorlage. </p>
<p> <strong> HTML5 Dokumenttyp Anweisung </strong> </p>
<p> Ihre HTML5 -Vorlage muss mit einer Deklaration von Dokumenttypen oder <em> docType </em> beginnen. docType ist nur eine M?glichkeit, den Browser oder einen anderen Parser mitzuteilen, welche Art von Dokument er betrachtet. Für HTML -Dateien bedeutet dies eine bestimmte Version und Art von HTML. docType sollte immer der erste Element oben in jeder HTML -Datei sein. Vor vielen Jahren war die DocType -Erkl?rung eine h?ssliche und schwer zu erinnerne Verwirrung, die normalerweise als "xhtml streng" oder "html transitional" bezeichnet wurde. </p>
<p> Mit dem Aufkommen von HTML5 verschwanden diese unverst?ndlichen nervigen Dinge, und jetzt brauchen Sie nur Folgendes: </p>
<pre class='brush:php;toolbar:false;'><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HTML5 Boilerplate</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Page Title</h1>
<??>
</body>
</html></pre>
<p> Einfach und klar. "5" verschwand deutlich aus der Aussage. Obwohl die aktuelle Version des Web -Tags als "HTML5" bezeichnet wird, ist sie wirklich nur eine Entwicklung früherer HTML -Standards - die zukünftigen Spezifikationen werden nur die Entwicklung sein, die wir heute haben. Es wird niemals "HTML6" geben, daher wird das Web -Tag des aktuellen Status normalerweise einfach "HTML" bezeichnet. </p>
<p> Da der Browser alte Inhalte im Web unterstützen muss, beruht er nicht auf docType, um dem Browser mitzuteilen, welche Funktionen in einem bestimmten Dokument unterstützt werden sollten. Mit anderen Worten, nur docType macht Ihre Seite nicht mit modernen HTML -Funktionen einverstanden. Tats?chlich bestimmt der Browser unabh?ngig vom verwendeten DocType den Merkmalsunterstützungsfall nach Fall. Tats?chlich k?nnen Sie den alten DocType mit dem neuen HTML5 -Element auf der Seite verwenden, und die Seite macht genauso wie bei der Verwendung des neuen DocType. </p>
<p> <strong> <code><html></code> Element </strong> </p>
Das Element <p> <code><html></code> ist das Element der obersten Ebene in einer HTML -Datei - was bedeutet, dass es alles au?er DocType im Dokument enth?lt. Das <code><html></code> -Element ist in zwei Teile unterteilt: <code><head></code> und <code><body></code> Teile. Alle anderen Inhalte in der Webseitendatei werden in oder im <code><html></code> -Element platziert. Der folgende Code zeigt das <code><html></code> -Element, das sich nach der DocType -Deklaration befindet und die Elemente <code><html></code> und <code><head></code> enth?lt: <code><body></code>
</p>
<pre class='brush:php;toolbar:false;'><!DOCTYPE html></pre> <p> wie man Tags in html <strong> </strong> verwendet
Der Abschnitt </p> <p> enth?lt wichtige Informationen zum Dokument, das nicht dem Endbenutzer angezeigt wird - z. B. Zeichenkodierung und Links zu CSS -Dateien und m?glicherweise JavaScript -Dateien. Diese Informationen werden von Maschinen wie Browsern, Suchmaschinen und Bildschirmlesern verwendet: <code><head></code>
</p>
Alle Elemente, die zwischen den obigen <pre class='brush:php;toolbar:false;'><html lang="en">
<head>
</head>
<body>
</body>
</html></pre>… <p> -Tags enthalten sind, sind wichtig, aber Endbenutzer sehen es nicht - mit Ausnahme des Textes <code><head></code>, es wird in Online -Such- und Browser -Tags angezeigt. <code></head></code><p> <strong> wie man Tags in html </strong> </p> verwendet
Der Abschnitt <p> <code><body></code> enth?lt alles, was im Browser angezeigt wird - z. B. Text, Bilder usw. Wenn Sie dem Endbenutzer etwas anzeigen m?chten, stellen Sie sicher, dass Sie es zwischen ein und aus <code><body></code>… <code></body></code> Tags: </p> platzieren: <pre class='brush:php;toolbar:false;'><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HTML5 Boilerplate</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Page Title</h1>
<??>
</body>
</html></pre>
<p>
<img src="/static/imghw/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/173897581228837.jpg" class="lazy" alt="HTML5 Template: A Base Starter HTML Boilerplate for Any Project " /> </p> <p>
<strong> <code>lang</code> </strong> Was sind die Attribute? </p> <p>
Das <code><html></code> <code>lang</code> Element sollte idealerweise das Attribut <code><html lang="en"></code> enthalten, wie im obigen Code (</p>) gezeigt. Sein Hauptzweck ist es, assistierende Technologien wie Bildschirmleser zu erz?hlen, wie sie beim Vorlesen sie aussprechen. (Diese Eigenschaft ist für die Seitenüberprüfung nicht erforderlich, aber die meisten Validatoren geben Warnungen aus, wenn Sie sie nicht einschlie?en.) <p>
<code>lang</code> Der oben gezeigte Wert des oben gezeigten <code>en</code> -attributs ist <code>fr</code>, wodurch das Dokument in englischer Sprache geschrieben ist. Alle anderen gesprochenen Sprachen haben Werte wie <code>de</code> in Franz?sisch, <code>hi</code> in Deutsch, </p> in Hindi usw. (Sie finden eine vollst?ndige Liste von Sprachcodes auf Wikipedia.) <p>
<strong> </strong> HTML -Dokument Zeichenkodierung </p> <p>
Die erste Zeile im Abschnitt <code><head></code> HTML -Dokument </p> ist die Zeile, die die Zeichencodierung des Dokuments definiert. Die Buchstaben und Symbole, die wir auf Webseiten lesen, werden als eine Reihe von Zahlen definiert, und einige Zeichen (z. B. Buchstaben) werden in vielerlei Hinsicht codiert. Daher ist es nützlich, Ihren Computer mitzuteilen, auf welche Codierung Ihre Webseite sich beziehen sollte. Anzeigencharaktercodierung ist eine optionale Funktion, die keine Warnungen im Validator hervorruft. Auf den meisten HTML -Seiten wird jedoch empfohlen: <pre class='brush:php;toolbar:false;'><!DOCTYPE html></pre>
<p>
<em> <code><title></code> Hinweis: Um sicherzustellen, dass einige ?ltere Browser die Charakter -Codierung korrekt lesen, muss die gesamte Erkl?rung für die Codierungskodierung von Charakteren irgendwo in die ersten 512 Zeichen des Dokuments aufgenommen werden. Es sollte auch vor einem inhaltsbasierten Element angezeigt werden (wie das </em> -Element, das sp?ter in unserem Beispiel angezeigt wird). </p> <h3>
</h3> Warum verwenden Sie die UTF-8-Zeichencodierung in HTML5-Vorlagen? <p>
<code>utf-8</code> Das obige Zeichen-Codierungsbeispiel verwendet den UTF-8-Zeichensatz. In fast allen F?llen ist </p> der Wert, den Sie in Ihrem Dokument verwenden sollten. Diese Codierung deckt verschiedene Zeichen ab, die nicht in anderen Codierungen enthalten sind. M?glicherweise haben Sie beispielsweise auf seltsame Charaktere im Web gesto?en, was offensichtlich ein Fehler ist. Dies liegt normalerweise daran, dass der Browser die erwarteten Zeichen in dem im Dokument angegebenen Zeichensatz nicht finden kann. <p>
</p> UTF-8 deckt eine Vielzahl von Charakteren ab, darunter viele Charaktere in verschiedenen Sprachen auf der ganzen Welt sowie viele nützliche Symbole. Wie die World Wide Web Alliance erkl?rt: <blockquote>
<p>
</p> Unicode-basierte Codierungen (z. B. UTF-8) k?nnen mehrere Sprachen unterstützen und an alle Sprachmischseiten und -formen angepasst werden. Die Verwendung kann auch die serverseitige Logik beseitigen, wodurch die Zeichenkodierung für jede Serviceseite oder für jede Einreichungsformulareingabe individuell bestimmt wird. Dies verringert die Komplexit?t der Umgang mit mehrsprachigen Websites oder Anwendungen erheblich. </blockquote>
<p> Die vollst?ndige Erkl?rung der Charaktercodierung liegt au?erhalb des Rahmens dieses Artikels. Wenn Sie jedoch tiefer graben m?chten, k?nnen Sie in der HTML -Spezifikation über die Charaktercodierung lesen. </p>
Was bedeutet <p> <strong> <code>X-UA-Compatible</code>? </strong> </p>
<p> Sie sehen diese Zeile manchmal in <code><head></code> Ihres HTML -Dokuments: </p>
<pre class='brush:php;toolbar:false;'><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HTML5 Boilerplate</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Page Title</h1>
<??>
</body>
</html></pre>
<p> Mit diesem Meta -Tag k?nnen Webautoren die Version von Internet Explorer ausw?hlen, die die Seite rendern sollte. Jetzt, da Internet Explorer gr??tenteils nur ein schlechter Speicher ist, k?nnen Sie diese Zeile sicher aus Ihrem Code entfernen. (Wir haben es aus der HTML5 -Vorlage entfernt.) Wenn Sie sicher sind, dass Ihre Seite in einer ?lteren Version von IE angezeigt wird, ist es m?glicherweise eine Einbeziehung wert. Weitere Informationen zu diesem Meta -Tag finden Sie auf der Microsoft -Website. </p>
<p> <strong> Ansichtsfenster -Element </strong> </p>
<p> Ansichtsfensterelement ist eine Funktion, die Sie in fast jeder HTML5 -Vorlage sehen werden. Es ist sehr wichtig für das reaktionsschnelle Webdesign und das mobile Design: </p>
<pre class='brush:php;toolbar:false;'><!DOCTYPE html></pre>
<p> Dieses <code><meta></code> Element enth?lt zwei Eigenschaften, die als Name/Wert -Set zusammenarbeiten. In diesem Fall wird der Name auf <code>viewport</code> gesetzt und der Wert ist <code>width=device-width, initial-scale=1</code>. Dies gilt nur für mobile Ger?te. Sie werden feststellen, dass es zwei Teile des Wertes gibt: </p>
<ul>
<li> <code>width=device-width</code>: Die Pixelbreite des Ansichtsfensters soll die Website vorstellen. </li>
<li> <code>initial-scale</code>: Dies sollte eine positive Zahl zwischen 0,0 und 10,0 sein. Der Wert von "1" zeigt ein Verh?ltnis von 1: 1 zwischen der Ger?tebreite und der Ansichtsfenstergr??e an. </li>
</ul>
<p> Sie k?nnen mehr über diese Meta-Element-Eigenschaften auf MDN lesen, aber jetzt müssen Sie nur wissen, dass in den meisten F?llen dieses Meta-Element und seine Einstellungen am besten für mobile reaktionsschnelle Websites geeignet sind. </p>
<p> <strong> <code><title></code>, Beschreibung und Autor </strong> </p>
<p> Der n?chste Teil der HTML -Basisvorlage enth?lt die folgenden drei Zeilen: </p>
<pre class='brush:php;toolbar:false;'><html lang="en">
<head>
</head>
<body>
</body>
</html></pre>
<p> <code><title></code> ist das, was in der Titelleiste des Browsers angezeigt wird (z. B. wenn Sie über die Registerkarte Browser schweben), der auch in den Suchergebnissen angezeigt wird. Dieses Element ist das einzig erforderliche Element im Abschnitt <code><head></code>. Beschreibung und Autor -Metaelements sind optional, bieten jedoch wichtige Informationen für Suchmaschinen. In den Suchergebnissen werden der Titel und die Beschreibung im obigen Codebeispiel unten angezeigt. </p>
<p> <img src="/static/imghw/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/173897581334276.jpg" class="lazy" alt="HTML5 Template: A Base Starter HTML Boilerplate for Any Project " /> </p>
<p> Sie k?nnen eine beliebige Anzahl gültiger Elementelemente in <code><head></code> platzieren. </p>
<p> <strong> Graph -Element für soziale Karten ?ffnen </strong> </p>
<p> Wie oben erw?hnt, sind alle Meta -Elemente optional, aber viele sind gut für SEO- und Social -Media -Marketing. Der n?chste Teil der HTML5-Vorlage enth?lt einige dieser Meta-Elementoptionen: </p>
<pre class='brush:php;toolbar:false;'><head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HTML5 Boilerplate</title>
<link rel="stylesheet" href="styles.css">
<??>
</head></pre>
<p> Diese <code><meta></code> Elemente verwenden das sogenannte Open-Graph-Protokoll, und es gibt viele andere Elemente, die Sie verwenden k?nnen. Dies sind die Elemente, die Sie am h?ufigsten verwenden. Sie k?nnen eine vollst?ndige Liste der verfügbaren Open -Graph -Meta -Optionen auf der Website Open Graph anzeigen. </p><p> Diese hier enthaltenen Elemente verbessern das Erscheinungsbild der Webseite, wenn sie mit Social -Media -Posts verknüpft sind. Beispielsweise werden die fünf hier enthaltenen Elemente in einer sozialen Karte angezeigt, die mit den folgenden Daten eingebettet ist: <code><meta></code>
</p>
<ul> Titel des Inhalts <li>
</li> bereitgestellte Inhaltstypen <li>
</li> Inhaltspezifikation URL <li>
</li> Beschreibung des Inhalts <li>
</li> Bild, das mit dem Inhalt <li> zugeordnet ist
</li>
</ul> Wenn Sie Beitr?ge in sozialen Medien teilen sehen, werden diese Datenbits in der Regel automatisch zu Social -Media -Posts hinzugefügt. Wenn Sie beispielsweise einen Link zur GitHub -Homepage angeben, wird im Tweet Folgendes angezeigt. <p>
</p> <p> <img src="/static/imghw/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/173897581532472.jpg" class="lazy" alt="HTML5 Template: A Base Starter HTML Boilerplate for Any Project " />
</p> <p> Favicon und Berührungssymbole <strong> </strong>
</p> Der n?chste Teil der HTML5 -Vorlage enth?lt <p> Elemente, die die Ressourcen als Favicon- und Apple -Touch -Symbole angeben: <code><link></code>
</p>
<pre class='brush:php;toolbar:false;'><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HTML5 Boilerplate</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Page Title</h1>
<??>
</body>
</html></pre> Favicon wird auf der Registerkarte Browser angezeigt, wenn jemand Ihre Website überprüft. <p> Dateien werden in ?lteren Browsern verwendet und müssen nicht in den Code aufgenommen werden. Solange Ihre <code>favicon.ico</code> -Datei im Stammverzeichnis des Projekts enthalten ist, findet der Browser sie automatisch. <code>favicon.ico</code> Dateien werden in modernen Browsern verwendet, die SVG -Symbole unterstützen. Sie k?nnen stattdessen auch .png -Dateien verwenden. <code>favicon.svg</code>
</p> Das letzte Element bezieht sich auf das auf Apple -Ger?ten verwendete Symbol beim Hinzufügen der Seite zum Startbildschirm des Benutzers. <p>
</p> Sie k?nnen hier zus?tzliche Optionen einfügen, einschlie?lich Webanwendungsmanifestdateien, die auf andere Symbole verweisen. Für die vollst?ndige Diskussion empfehlen wir Ihnen, Andrey Sitniks Artikel zu diesem Thema zu lesen. Aber die hier enthalten sind ausreichend für einfache HTML -Anf?ngervorlagen. <p>
</p> <p> enth?lt CSS -Stylesheets und JavaScript -Dateien <strong> </strong>
</p> Die letzten beiden wichtigen Teile der HTML -Erste -Start -Vorlage sind Verweise auf ein oder mehrere Stylesheets und m?glicherweise JavaScript -Dateien. Natürlich sind beide optional, obwohl nur wenige Websites nicht zumindest einige CSS -Stile haben. <p>
</p> CSS -Stylesheet in die HTML -Vorlage <h3 id="integrieren"> integrieren </h3>
<p> Stylesheets k?nnen überall in das Dokument aufgenommen werden, aber Sie werden es normalerweise im Abschnitt <code><head></code> sehen: </p>
<pre class='brush:php;toolbar:false;'><!DOCTYPE html></pre>
Das Element <p> <code><link></code> zeigt den Webbrowser auf ein externes Stylesheet, damit diese CSS -Stile auf die Seite anwenden k?nnen. Das <code><link></code> Element erfordert, dass das Attribut <code>rel</code> <code>stylesheet</code> ist. In der Vergangenheit gab es normalerweise auch ein <code>type</code> -Merkmals, aber es wurde nie wirklich ben?tigt. Wenn Sie also den alten Code finden, der ihn im Web enth?lt, l?schen Sie ihn einfach. </p>
<p> Beachten Sie, dass wir die <code>?v=1.0</code> -Anterfragezeichenfolge am Ende des CSS -Links hinzugefügt haben. Dies ist v?llig optional. Dies ist ein praktischer Trick, wenn Sie das Stylesheet aktualisieren, um diese Abfragezeichenfolge zu aktualisieren (z. B. Aktualisierung auf 1.1 oder 2.0), da dies sicherstellt, dass der Browser eine alte, zwischengespeicherte Kopie von CSS -Dateien verurteilt und die neue Version l?dt. </p><p> Es ist erw?hnenswert, dass Sie das <code><link></code> -Element nicht verwenden müssen, um CSS auf der Webseite aufzunehmen, da Sie stattdessen alle Stile in das <code><style></code>… <code></style></code> -Tag der Seite selbst einfügen k?nnen, die sich in befinden der Abschnitt <code><head></code>. Dies ist sehr bequem, wenn Sie mit Layouts experimentieren, dies wird jedoch im Allgemeinen nicht an aktiven Stellen empfohlen, da diese Stile auf anderen Seiten nicht zug?nglich sind, was zu ineffizienten und/oder doppelten Code führt. </p>
<h3 id="Integrieren-Sie-JavaScript-Dateien-in-HTML-Vorlagen"> Integrieren Sie JavaScript -Dateien in HTML -Vorlagen </h3>
<p> JavaScript -Code übergibt normalerweise <code></pre>
?
<p>
</body></code> <code></p></code>
<pre class='brush:php;toolbar:false;'><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HTML5 Boilerplate</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Page Title</h1>
<??>
</body>
</html></pre> Das Skript in das <p> -Tag: <strong> einbetten: </strong>
</p>
<p> <code><article></code> Anweisungen zu alten Browsern und neuen Elementen <code><aside></code> <code><recipe></code>
<code><ziggy></code> Als HTML5 eingeführt wurde, enthielt es viele neue Elemente wie </aside> und </article>. Sie k?nnten denken, dass die Unterstützung für nicht identifizierte Elemente ein wichtiges Problem für ?ltere Browser ist - aber das ist nicht der Fall! Die meisten Browser kümmern sich eigentlich nicht darum, welche Tags Sie verwenden. Wenn Sie ein HTML -Dokument haben, das ein </ziggy> Element (oder sogar ein </recipe> -Element) enth?lt und Ihr CSS bestimmte Stile an diesem Element anh?lt . </p> <p> </p> <p> </p>
<p> Natürlich überprüfen solche Annahmen nicht und es kann zu Barrierefreiheitsproblemen kommen, aber es wird in fast allen Browsern korrekt erledigt - die Ausnahme ist eine ?ltere Version von Internet Explorer (dh). Vor Version 9 blockierte der IE unerkannte Elemente aus den Empfangsstilen. Der Rendering -Motor behandelt diese mysteri?sen Elemente als "unbekannte Elemente", sodass Sie ihr Aussehen oder ihr Verhalten nicht ?ndern k?nnen. Dies schlie?t nicht nur die Elemente ein, die wir uns vorgestellt haben, sondern auch alle Elemente, die zum Zeitpunkt der Entwicklung dieser Browserversionen, einschlie?lich neuer HTML5 -Elemente, nicht definiert wurden. <em>
Zum Glück sind ?ltere Browser, die den neuen Elementstil nicht unterstützen, heutzutage kaum vorhanden, sodass Sie in fast jedem Projekt sicher ein neues HTML -Element verwenden k?nnen, ohne sich darüber Sorgen zu machen. </em>
</p> Das hei?t, wenn Sie wirklich alte Browser unterstützen müssen, k?nnen Sie immer noch das zuverl?ssige HTML5 Shiv verwenden, ein einfaches JavaScript -Snippet, das ursprünglich von John Ressig entwickelt wurde. Es wurde von Sjoerd Visschers Arbeit inspiriert, die neue HTML5 -Elemente in ?lteren Versionen von IE stilbar machte. Tats?chlich ist dies heute jedoch nicht notwendig. Wie Caniuse.com zeigt, werden HTML5 -Elemente in allen verwendeten Browsern unterstützt. <p>
<strong> </strong> Vollst?ndige HTML5 -Vorlage </p> <p>
</p> Dies ist unsere letzte HTML5 -Vorlage - eine einfache Vorlage, die Sie für jedes Projekt verwenden k?nnen: <pre class='brush:php;toolbar:false;'><!DOCTYPE html></pre>
<p>
<code><body></code> Sie k?nnen diesen einfachen und benutzerfreundlichen HTML5-Vorlagencode noch heute in jedes Projekt einfügen! Auf dieser Basis k?nnen Sie zwischen den <code></body></code> und </p> -Tags hinzufügen, was Sie wollen. <p>
<strong> </strong> Schlussfolgerung </p> <p> Es gibt viele HTML-Anf?nger-Vorlagen und Frameworks online mit vorbereiteten CSS und JavaScript-Dateien und vielen Inhalten vor dem Schreiben, die Sie verwenden und ?ndern k?nnen, wie Sie m?chten. Dies ist nicht unser Ziel. Die grundlegenden Vorlagen, die wir hier bereitstellen, enthalten alles, was Sie beim Entwerfen einer Webseite ben?tigen, damit Sie nicht jedes Mal von vorne anfangen müssen. </p>
<p> Sie k?nnen die grundlegenden HTML -Seitenvorlagen, die wir zu Beginn anzeigen, oder die vollst?ndigen Vorlagen, die wir oben angezeigt haben, kopieren und verwenden sie in Ihrem Projekt. Im Laufe der Zeit stellen Sie m?glicherweise fest, dass es Inhalte gibt, die Sie nicht oft ben?tigen, und einige der Dinge, die wir hier nicht erw?hnt haben, die Sie h?ufig verwenden, sodass Sie Ihre Vorlagen so aktualisieren k?nnen, dass Sie Ihren Workflow entsprechen. </p>
<p> <strong> N?chste Schritte </strong> </p>
<p> Eine gute M?glichkeit, Ihr Web -Layout auf die n?chste Ebene zu bringen, besteht darin, sch?ne Webdesignprinzipien zu verwenden, die vierte Ausgabe. In diesem Buch werden Ihnen Designprinzipien und <em> und </em> gezeigt, wie Sie sie im Internet implementieren k?nnen. Es wurde im September 2020 komplett umgeschrieben und enth?lt modernste Technologie, die Sie nirgendwo anders gelesen haben. </p>
<p> Um Ihr CSS -Wissen zu verbessern, helfen Ihnen unsere modernen CSS -Projektkurse, die neuesten fortgeschrittenen Versionen von CSS3 zu beherrschen. </p>
<p> Abgesehen davon k?nnen Sie Ihre Website oder Webanwendungsentwicklung mit interaktiven und programmatischen, reaktiven Benutzeroberfl?che auf die n?chste Ebene bringen. Schauen Sie sich beispielsweise die riesigen Ressourcen von SitePoint auf JavaScript an und reagieren Sie. Und erfahren Sie, wie Sie ein neues Projekt schneller mit unserem Leitfaden zu den besten Gerüst -Web -Tools und -Bibliotheken starten. Oder, wenn Sie ein Web -Erlebnis ohne Lerncodierung erstellen m?chten, lesen Sie unseren Starter -Leitfaden zur codeless Bewegung. Das neueste codeloses Tool ist ein Game-Changer. Zum ersten Mal haben sie in vielen F?llen eine leistungsstarke Alternative zur Codierung. </p>
<p> <strong> HTML5 -Template FAQ </strong>
</p> Schlie?lich werden wir h?ufig gestellte Fragen zum HTML5 -Vorlagencode beantworten. <p>
</p> Was sind Vorlagen in HTML? <h3>
</h3> Vorlage ist eine HTML -Seitenvorlage, die jedes Mal verwendet wird, wenn Sie ein Projekt starten, wodurch vermeiden wird, dass sie von vorne anfangen. Es enth?lt gemeinsame Elemente wie Deklarationen vom Dokumenttyp und grundlegende HTML -Elemente, die auf jeder Webseite angezeigt werden. <p>
</p> Ist eine Vorlage eine Vorlage? <h3>
</h3> Ja. Eine Vorlage ist eine sehr einfache HTML -Anf?ngervorlage, die Links zu grundlegenden Elementen enth?lt, die auf jeder Webseite angezeigt werden, z. B. Zeichencodierung, <p> und <code><head></code> Elemente sowie CSS und JavaScript -Dateien. <code><body></code>
</p> Wie erstelle ich eine Vorlage in HTML? <h3>
</h3> Eine M?glichkeit, eine eigene HTML -Vorlage zu erstellen, besteht darin, eine Webseite zu erhalten, ihren Quellcode zu kopieren und dann alles au?er den grundlegendsten Elementen zu l?schen, die auf jeder Webseite angezeigt werden. Oder Sie k?nnen unsere vorgefertigte HTML5-Vorlage erhalten und in die .html-Datei einfügen, und Sie k?nnen bereit sind zu gehen! <p><h3 id="Wofür-wird-die-HTML-Vorlage-verwendet"> Wofür wird die HTML5 -Vorlage verwendet? </h3>
<p> Beim Entwerfen einer Webseite gibt es nichts Schlimmeres, als den gesamten Bohrcode von Grund auf neu schreiben zu müssen, beginnend mit einer leeren .html -Seite. Unsere HTML5 -Vorlagen bieten Ihnen alle HTML -Vorlagencode, die Sie zum Ausführen ben?tigen, damit Sie sofort an Ihren einzigartigen Designs und Inhalten arbeiten k?nnen. </p>
<h3 id="Was-ist-das-Vorlage-Beispiel"> Was ist das Vorlage Beispiel? </h3>
<p> Es gibt viele Beispiele für HTML5 -Vorlagen im Internet. Im Laufe der Zeit k?nnen Sie Ihre eigenen Vorlagen erstellen, basierend auf der Art und Weise, wie Sie HTML selbst schreiben. Unser Beispiel für HTML5 -Vorlage enth?lt alle grundlegenden Elemente, die Sie auf den meisten Webseiten ben?tigen. </p>
<p> Als sehr einfacher Start k?nnen Sie dies nur verwenden: </p>
<pre class='brush:php;toolbar:false;'><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HTML5 Boilerplate</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Page Title</h1>
<??>
</body>
</html></pre>
<h3 id="Was-ist-der-Startcode-für-HTML"> Was ist der Startcode für HTML? </h3>
<p> HTML -Dokumente beginnen immer mit einer Deklaration vom Dokumenttyp: <code><!DOCTYPE html></code>. Dann gibt es das <code></code> -Tag, das alle anderen Inhalte auf der Webseite enth?lt. Die beiden Kinderelemente von <code></code> sind die Elemente <code></code> und <code></code>. Unsere HTML5 -Vorlage enth?lt den für jede Webseite erforderlichen grundlegenden Startcode. </p>
<h3 id="Ben?tigt-jede-HTML-Datei-eine-Vorlage"> Ben?tigt jede HTML -Datei eine Vorlage? </h3>
<p> Idealerweise ja. HTML -Vorlagen bieten die Mindestmenge an Code für HTML -Seiten, um nützliche Aktionen in einem Webbrowser auszuführen. Auf jeder Seite Ihrer Website k?nnen Sie HTML -Vorlagencode verwenden. In der Regel werden die g?ngigen Elemente der Vorlage von einer einzelnen Quelle in Ihre Seite injiziert, z. B. ein Framework oder die Datei einbeziehen, damit Sie die Vorlagen für alle Seiten gleichzeitig aktualisieren k?nnen. Unsere HTML5 -Vorlage enth?lt allen HTML -Vorlagencode, die Sie für den Einstieg ben?tigen. </p><p>Das obige ist der detaillierte Inhalt vonHTML5 -Vorlage: Ein Basisstarter HTML -Boilerplate für jedes Projekt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!</p>
</div>
</div>
<div id="377j5v51b" class="wzconShengming_sp">
<div id="377j5v51b" class="bzsmdiv_sp">Erkl?rung dieser Website</div>
<div>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</div>
</div>
</div>
<ins class="adsbygoogle"
style="display:block"
data-ad-format="autorelaxed"
data-ad-client="ca-pub-5902227090019525"
data-ad-slot="2507867629"></ins>
<div id="377j5v51b" class="AI_ToolDetails_main4sR">
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-5902227090019525"
data-ad-slot="3653428331"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<!-- <div id="377j5v51b" class="phpgenera_Details_mainR4">
<div id="377j5v51b" class="phpmain1_4R_readrank">
<div id="377j5v51b" class="phpmain1_4R_readrank_top">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/hotarticle2.png" alt="" />
<h2>Hei?er Artikel</h2>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottom">
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/1796819578.html" title="Wie kann ich KB5060533 in Windows 10 nicht installieren?" class="phpgenera_Details_mainR4_bottom_title">Wie kann ich KB5060533 in Windows 10 nicht installieren?</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<span>3 Wochen vor</span>
<span>By DDD</span>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/1796819730.html" title="Dune: Erwachen - wo man isolierten Stoff bekommt" class="phpgenera_Details_mainR4_bottom_title">Dune: Erwachen - wo man isolierten Stoff bekommt</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<span>3 Wochen vor</span>
<span>By Jack chen</span>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/1796819016.html" title="Google Mail Login: Wie melden Sie sich an, melden Sie sich an oder melden Sie sich von Google Mail an - Minitool" class="phpgenera_Details_mainR4_bottom_title">Google Mail Login: Wie melden Sie sich an, melden Sie sich an oder melden Sie sich von Google Mail an - Minitool</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<span>1 Monate vor</span>
<span>By Jack chen</span>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/1796819994.html" title="Wie kann ich KB5060999 in Windows 11 nicht installieren?" class="phpgenera_Details_mainR4_bottom_title">Wie kann ich KB5060999 in Windows 11 nicht installieren?</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<span>3 Wochen vor</span>
<span>By DDD</span>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/1796819536.html" title="Gildenführer in verdorbenem Gral: Der Fall von Avalon" class="phpgenera_Details_mainR4_bottom_title">Gildenführer in verdorbenem Gral: Der Fall von Avalon</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<span>4 Wochen vor</span>
<span>By Jack chen</span>
</div>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR3_more">
<a href="http://miracleart.cn/de/article.html">Mehr anzeigen</a>
</div>
</div>
</div> -->
<div id="377j5v51b" class="phpgenera_Details_mainR3">
<div id="377j5v51b" class="phpmain1_4R_readrank">
<div id="377j5v51b" class="phpmain1_4R_readrank_top">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/hottools2.png" alt="" />
<h2>Hei?e KI -Werkzeuge</h2>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR3_bottom">
<div id="377j5v51b" class="phpmain_tab2_mids_top">
<a href="http://miracleart.cn/de/ai/undress-ai-tool" title="Undress AI Tool" class="phpmain_tab2_mids_top_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173410641626608.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Undress AI Tool" />
</a>
<div id="377j5v51b" class="phpmain_tab2_mids_info">
<a href="http://miracleart.cn/de/ai/undress-ai-tool" title="Undress AI Tool" class="phpmain_tab2_mids_title">
<h3>Undress AI Tool</h3>
</a>
<p>Ausziehbilder kostenlos</p>
</div>
</div>
<div id="377j5v51b" class="phpmain_tab2_mids_top">
<a href="http://miracleart.cn/de/ai/undresserai-undress" title="Undresser.AI Undress" class="phpmain_tab2_mids_top_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173411540686492.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Undresser.AI Undress" />
</a>
<div id="377j5v51b" class="phpmain_tab2_mids_info">
<a href="http://miracleart.cn/de/ai/undresserai-undress" title="Undresser.AI Undress" class="phpmain_tab2_mids_title">
<h3>Undresser.AI Undress</h3>
</a>
<p>KI-gestützte App zum Erstellen realistischer Aktfotos</p>
</div>
</div>
<div id="377j5v51b" class="phpmain_tab2_mids_top">
<a href="http://miracleart.cn/de/ai/ai-clothes-remover" title="AI Clothes Remover" class="phpmain_tab2_mids_top_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173411552797167.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="AI Clothes Remover" />
</a>
<div id="377j5v51b" class="phpmain_tab2_mids_info">
<a href="http://miracleart.cn/de/ai/ai-clothes-remover" title="AI Clothes Remover" class="phpmain_tab2_mids_title">
<h3>AI Clothes Remover</h3>
</a>
<p>Online-KI-Tool zum Entfernen von Kleidung aus Fotos.</p>
</div>
</div>
<div id="377j5v51b" class="phpmain_tab2_mids_top">
<a href="http://miracleart.cn/de/ai/clothoffio" title="Clothoff.io" class="phpmain_tab2_mids_top_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173411529149311.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Clothoff.io" />
</a>
<div id="377j5v51b" class="phpmain_tab2_mids_info">
<a href="http://miracleart.cn/de/ai/clothoffio" title="Clothoff.io" class="phpmain_tab2_mids_title">
<h3>Clothoff.io</h3>
</a>
<p>KI-Kleiderentferner</p>
</div>
</div>
<div id="377j5v51b" class="phpmain_tab2_mids_top">
<a href="http://miracleart.cn/de/ai/video-swap" title="Video Face Swap" class="phpmain_tab2_mids_top_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173414504068133.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Video Face Swap" />
</a>
<div id="377j5v51b" class="phpmain_tab2_mids_info">
<a href="http://miracleart.cn/de/ai/video-swap" title="Video Face Swap" class="phpmain_tab2_mids_title">
<h3>Video Face Swap</h3>
</a>
<p>Tauschen Sie Gesichter in jedem Video mühelos mit unserem v?llig kostenlosen KI-Gesichtstausch-Tool aus!</p>
</div>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR3_more">
<a href="http://miracleart.cn/de/ai">Mehr anzeigen</a>
</div>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4">
<div id="377j5v51b" class="phpmain1_4R_readrank">
<div id="377j5v51b" class="phpmain1_4R_readrank_top">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/hotarticle2.png" alt="" />
<h2>Hei?er Artikel</h2>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottom">
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/1796819578.html" title="Wie kann ich KB5060533 in Windows 10 nicht installieren?" class="phpgenera_Details_mainR4_bottom_title">Wie kann ich KB5060533 in Windows 10 nicht installieren?</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<span>3 Wochen vor</span>
<span>By DDD</span>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/1796819730.html" title="Dune: Erwachen - wo man isolierten Stoff bekommt" class="phpgenera_Details_mainR4_bottom_title">Dune: Erwachen - wo man isolierten Stoff bekommt</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<span>3 Wochen vor</span>
<span>By Jack chen</span>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/1796819016.html" title="Google Mail Login: Wie melden Sie sich an, melden Sie sich an oder melden Sie sich von Google Mail an - Minitool" class="phpgenera_Details_mainR4_bottom_title">Google Mail Login: Wie melden Sie sich an, melden Sie sich an oder melden Sie sich von Google Mail an - Minitool</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<span>1 Monate vor</span>
<span>By Jack chen</span>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/1796819994.html" title="Wie kann ich KB5060999 in Windows 11 nicht installieren?" class="phpgenera_Details_mainR4_bottom_title">Wie kann ich KB5060999 in Windows 11 nicht installieren?</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<span>3 Wochen vor</span>
<span>By DDD</span>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/1796819536.html" title="Gildenführer in verdorbenem Gral: Der Fall von Avalon" class="phpgenera_Details_mainR4_bottom_title">Gildenführer in verdorbenem Gral: Der Fall von Avalon</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<span>4 Wochen vor</span>
<span>By Jack chen</span>
</div>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR3_more">
<a href="http://miracleart.cn/de/article.html">Mehr anzeigen</a>
</div>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR3">
<div id="377j5v51b" class="phpmain1_4R_readrank">
<div id="377j5v51b" class="phpmain1_4R_readrank_top">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/hottools2.png" alt="" />
<h2>Hei?e Werkzeuge</h2>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR3_bottom">
<div id="377j5v51b" class="phpmain_tab2_mids_top">
<a href="http://miracleart.cn/de/toolset/development-tools/92" title="Notepad++7.3.1" class="phpmain_tab2_mids_top_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58ab96f0f39f7357.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="Notepad++7.3.1" />
</a>
<div id="377j5v51b" class="phpmain_tab2_mids_info">
<a href="http://miracleart.cn/de/toolset/development-tools/92" title="Notepad++7.3.1" class="phpmain_tab2_mids_title">
<h3>Notepad++7.3.1</h3>
</a>
<p>Einfach zu bedienender und kostenloser Code-Editor</p>
</div>
</div>
<div id="377j5v51b" class="phpmain_tab2_mids_top">
<a href="http://miracleart.cn/de/toolset/development-tools/93" title="SublimeText3 chinesische Version" class="phpmain_tab2_mids_top_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58ab97a3baad9677.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="SublimeText3 chinesische Version" />
</a>
<div id="377j5v51b" class="phpmain_tab2_mids_info">
<a href="http://miracleart.cn/de/toolset/development-tools/93" title="SublimeText3 chinesische Version" class="phpmain_tab2_mids_title">
<h3>SublimeText3 chinesische Version</h3>
</a>
<p>Chinesische Version, sehr einfach zu bedienen</p>
</div>
</div>
<div id="377j5v51b" class="phpmain_tab2_mids_top">
<a href="http://miracleart.cn/de/toolset/development-tools/121" title="Senden Sie Studio 13.0.1" class="phpmain_tab2_mids_top_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58ab97ecd1ab2670.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="Senden Sie Studio 13.0.1" />
</a>
<div id="377j5v51b" class="phpmain_tab2_mids_info">
<a href="http://miracleart.cn/de/toolset/development-tools/121" title="Senden Sie Studio 13.0.1" class="phpmain_tab2_mids_title">
<h3>Senden Sie Studio 13.0.1</h3>
</a>
<p>Leistungsstarke integrierte PHP-Entwicklungsumgebung</p>
</div>
</div>
<div id="377j5v51b" class="phpmain_tab2_mids_top">
<a href="http://miracleart.cn/de/toolset/development-tools/469" title="Dreamweaver CS6" class="phpmain_tab2_mids_top_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58d0e0fc74683535.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="Dreamweaver CS6" />
</a>
<div id="377j5v51b" class="phpmain_tab2_mids_info">
<a href="http://miracleart.cn/de/toolset/development-tools/469" title="Dreamweaver CS6" class="phpmain_tab2_mids_title">
<h3>Dreamweaver CS6</h3>
</a>
<p>Visuelle Webentwicklungstools</p>
</div>
</div>
<div id="377j5v51b" class="phpmain_tab2_mids_top">
<a href="http://miracleart.cn/de/toolset/development-tools/500" title="SublimeText3 Mac-Version" class="phpmain_tab2_mids_top_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58d34035e2757995.png?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="SublimeText3 Mac-Version" />
</a>
<div id="377j5v51b" class="phpmain_tab2_mids_info">
<a href="http://miracleart.cn/de/toolset/development-tools/500" title="SublimeText3 Mac-Version" class="phpmain_tab2_mids_title">
<h3>SublimeText3 Mac-Version</h3>
</a>
<p>Codebearbeitungssoftware auf Gottesniveau (SublimeText3)</p>
</div>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR3_more">
<a href="http://miracleart.cn/de/ai">Mehr anzeigen</a>
</div>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4">
<div id="377j5v51b" class="phpmain1_4R_readrank">
<div id="377j5v51b" class="phpmain1_4R_readrank_top">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/hotarticle2.png" alt="" />
<h2>Hei?e Themen</h2>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottom">
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/gmailyxdlrkzn" title="Wo ist der Login-Zugang für Gmail-E-Mail?" class="phpgenera_Details_mainR4_bottom_title">Wo ist der Login-Zugang für Gmail-E-Mail?</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos">
<img src="/static/imghw/eyess.png" alt="" />
<span>8517</span>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos">
<img src="/static/imghw/tiezi.png" alt="" />
<span>17</span>
</div>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/java-tutorial" title="Java-Tutorial" class="phpgenera_Details_mainR4_bottom_title">Java-Tutorial</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos">
<img src="/static/imghw/eyess.png" alt="" />
<span>1742</span>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos">
<img src="/static/imghw/tiezi.png" alt="" />
<span>16</span>
</div>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/cakephp-tutor" title="CakePHP-Tutorial" class="phpgenera_Details_mainR4_bottom_title">CakePHP-Tutorial</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos">
<img src="/static/imghw/eyess.png" alt="" />
<span>1596</span>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos">
<img src="/static/imghw/tiezi.png" alt="" />
<span>56</span>
</div>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/laravel-tutori" title="Laravel-Tutorial" class="phpgenera_Details_mainR4_bottom_title">Laravel-Tutorial</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos">
<img src="/static/imghw/eyess.png" alt="" />
<span>1536</span>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos">
<img src="/static/imghw/tiezi.png" alt="" />
<span>28</span>
</div>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms">
<a href="http://miracleart.cn/de/faq/php-tutorial" title="PHP-Tutorial" class="phpgenera_Details_mainR4_bottom_title">PHP-Tutorial</a>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info">
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos">
<img src="/static/imghw/eyess.png" alt="" />
<span>1396</span>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos">
<img src="/static/imghw/tiezi.png" alt="" />
<span>31</span>
</div>
</div>
</div>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainR3_more">
<a href="http://miracleart.cn/de/faq/zt">Mehr anzeigen</a>
</div>
</div>
</div>
</div>
</div>
<div id="377j5v51b" class="Article_Details_main2">
<div id="377j5v51b" class="phpgenera_Details_mainL4">
<div id="377j5v51b" class="phpmain1_2_top">
<a href="javascript:void(0);" class="phpmain1_2_top_title">Related knowledge<img
src="/static/imghw/index2_title2.png" alt="" /></a>
</div>
<div id="377j5v51b" class="phpgenera_Details_mainL4_info">
<div id="377j5v51b" class="phphistorical_Version2_mids">
<a href="http://miracleart.cn/de/faq/1796819239.html" title="Wie kann ich CSS nur auf einige Seiten einbeziehen?" class="phphistorical_Version2_mids_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/174957130281670.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Wie kann ich CSS nur auf einige Seiten einbeziehen?" />
</a>
<a href="http://miracleart.cn/de/faq/1796819239.html" title="Wie kann ich CSS nur auf einige Seiten einbeziehen?" class="phphistorical_Version2_mids_title">Wie kann ich CSS nur auf einige Seiten einbeziehen?</a>
<span id="377j5v51b" class="Articlelist_txts_time">Jun 11, 2025 am 12:01 AM</span>
<p class="Articlelist_txts_p">Es gibt drei M?glichkeiten, CSS auf einer bestimmten Seite selektiv aufzunehmen: 1. Inline -CSS, geeignet für Seiten, auf die nicht h?ufig zugegriffen wird oder einzigartige Stile erfordern. 2. Laden Sie externe CSS -Dateien mit JavaScript -Bedingungen, die für Situationen geeignet sind, in denen Flexibilit?t erforderlich ist. 3. Containment auf der Serverseite, geeignet für Szenarien mit serverseitigen Sprachen. Dieser Ansatz kann die Leistung und die Wartbarkeit der Website optimieren, erfordert jedoch ein Gleichgewicht zwischen Modularit?t und Leistung.</p>
</div>
<div id="377j5v51b" class="phphistorical_Version2_mids">
<a href="http://miracleart.cn/de/faq/1796819001.html" title="Flexbox vs Grid: Verst?ndnis der wichtigsten Unterschiede im CSS -Layout" class="phphistorical_Version2_mids_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/174948499050663.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Flexbox vs Grid: Verst?ndnis der wichtigsten Unterschiede im CSS -Layout" />
</a>
<a href="http://miracleart.cn/de/faq/1796819001.html" title="Flexbox vs Grid: Verst?ndnis der wichtigsten Unterschiede im CSS -Layout" class="phphistorical_Version2_mids_title">Flexbox vs Grid: Verst?ndnis der wichtigsten Unterschiede im CSS -Layout</a>
<span id="377j5v51b" class="Articlelist_txts_time">Jun 10, 2025 am 12:03 AM</span>
<p class="Articlelist_txts_p">FlexBoxisidealForone-dimensionAllayouts, w?hrend GridSuitStwo-dimensional, komplexeLayouts.seflexBoxForAnGingItemsinasingleaxisandGridForPreciseControloverrowsandColumnSininTridrideseseseses-Signs.</p>
</div>
<div id="377j5v51b" class="phphistorical_Version2_mids">
<a href="http://miracleart.cn/de/faq/1796819129.html" title="Erstellen einer Benachrichtigung über automatische Abzüge mit einem HTML-Popover" class="phphistorical_Version2_mids_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/242/473/174951991745342.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Erstellen einer Benachrichtigung über automatische Abzüge mit einem HTML-Popover" />
</a>
<a href="http://miracleart.cn/de/faq/1796819129.html" title="Erstellen einer Benachrichtigung über automatische Abzüge mit einem HTML-Popover" class="phphistorical_Version2_mids_title">Erstellen einer Benachrichtigung über automatische Abzüge mit einem HTML-Popover</a>
<span id="377j5v51b" class="Articlelist_txts_time">Jun 10, 2025 am 09:45 AM</span>
<p class="Articlelist_txts_p">Das HTML-Popover-Attribut verwandelt Elemente in Top-Layer-Elemente, die mit einer Taste oder einem JavaScript ge?ffnet und geschlossen werden k?nnen. Popovers k?nnen auf eine Reihe von M?glichkeiten abgewiesen werden, aber es gibt keine M?glichkeit, sie automatisch einzuschlie?en. Preethi hat eine Technik, die Sie k?nnen</p>
</div>
<div id="377j5v51b" class="phphistorical_Version2_mids">
<a href="http://miracleart.cn/de/faq/1796823628.html" title="Was ist 'Render-Blocking-CSS'?" class="phphistorical_Version2_mids_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/175069693197174.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Was ist 'Render-Blocking-CSS'?" />
</a>
<a href="http://miracleart.cn/de/faq/1796823628.html" title="Was ist 'Render-Blocking-CSS'?" class="phphistorical_Version2_mids_title">Was ist 'Render-Blocking-CSS'?</a>
<span id="377j5v51b" class="Articlelist_txts_time">Jun 24, 2025 am 12:42 AM</span>
<p class="Articlelist_txts_p">CSS -Bl?cke Seitenrenderung, da Browser inline und externe CSS standardm??ig als wichtige Ressourcen anzeigen, insbesondere mit importierten Stylesheets, Header gro?er Mengen an Inline -CSS und nicht optimierten Medienfragestilen. 1. extrahieren kritische CSS und einbetten Sie es in HTML ein; 2. Verz?gerung des Ladens nichtkritischer CSS durch JavaScript; 3.. Verwenden Sie Medienattribute, um das Laden wie Druckstile zu optimieren. 4. Komprimieren und verschmelzen CSS, um Anfragen zu reduzieren. Es wird empfohlen, Tools zum Extrahieren von Schlüssel -CSS zu verwenden, REL = "Vorspannung" zu kombinieren, und verwenden Sie die asynchrone Belastung und verwenden Sie die Medienverz?gerungsladeverletzung, um eine überm??ige Aufteilung und eine komplexe Skriptsteuerung zu vermeiden.</p>
</div>
<div id="377j5v51b" class="phphistorical_Version2_mids">
<a href="http://miracleart.cn/de/faq/1796820543.html" title="So verwenden Sie Lottien in Figma" class="phphistorical_Version2_mids_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/242/473/174986743677204.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="So verwenden Sie Lottien in Figma" />
</a>
<a href="http://miracleart.cn/de/faq/1796820543.html" title="So verwenden Sie Lottien in Figma" class="phphistorical_Version2_mids_title">So verwenden Sie Lottien in Figma</a>
<span id="377j5v51b" class="Articlelist_txts_time">Jun 14, 2025 am 10:17 AM</span>
<p class="Articlelist_txts_p">Im folgenden Tutorial werde ich Ihnen zeigen, wie Sie Lottie -Animationen in Figma erstellen. Wir werden zwei farbenfrohe Designs verwenden, um zu veranlassen, wie Sie in Figma animieren k?nnen, und dann werde ich Ihnen zeigen, wie Sie von Figma zu Lottie -Animationen wechseln. Alles was Sie brauchen ist eine kostenlose Feige</p>
</div>
<div id="377j5v51b" class="phphistorical_Version2_mids">
<a href="http://miracleart.cn/de/faq/1796820287.html" title="Grenzen brechen: Bauen eines Tangram -Puzzles mit (s) CSS" class="phphistorical_Version2_mids_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/242/473/174978559468682.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Grenzen brechen: Bauen eines Tangram -Puzzles mit (s) CSS" />
</a>
<a href="http://miracleart.cn/de/faq/1796820287.html" title="Grenzen brechen: Bauen eines Tangram -Puzzles mit (s) CSS" class="phphistorical_Version2_mids_title">Grenzen brechen: Bauen eines Tangram -Puzzles mit (s) CSS</a>
<span id="377j5v51b" class="Articlelist_txts_time">Jun 13, 2025 am 11:33 AM</span>
<p class="Articlelist_txts_p">Wir haben es auf die Probe gestellt und es stellt sich heraus, dass Sass JavaScript zumindest bei Logik und Puzzle-Verhalten auf niedriger Ebene ersetzen kann. Mit nichts als Karten, Mixins, Funktionen und einer Menge Mathematik haben wir es geschafft, unser Tangram -R?tsel zum Leben zu erwecken, nein J</p>
</div>
<div id="377j5v51b" class="phphistorical_Version2_mids">
<a href="http://miracleart.cn/de/faq/1796822133.html" title="Externe vs. interne CSS: Was ist der beste Ansatz?" class="phphistorical_Version2_mids_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/175035152168797.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Externe vs. interne CSS: Was ist der beste Ansatz?" />
</a>
<a href="http://miracleart.cn/de/faq/1796822133.html" title="Externe vs. interne CSS: Was ist der beste Ansatz?" class="phphistorical_Version2_mids_title">Externe vs. interne CSS: Was ist der beste Ansatz?</a>
<span id="377j5v51b" class="Articlelist_txts_time">Jun 20, 2025 am 12:45 AM</span>
<p class="Articlelist_txts_p">ThebestApproachforcssDependsonTheProject'Sspecificneeds.forlargerProjects, externalcssisbetterDuetomaintainability;</p>
</div>
<div id="377j5v51b" class="phphistorical_Version2_mids">
<a href="http://miracleart.cn/de/faq/1796821588.html" title="Muss mein CSS im unteren Fall sein?" class="phphistorical_Version2_mids_img">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'"
src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/175026415047262.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Muss mein CSS im unteren Fall sein?" />
</a>
<a href="http://miracleart.cn/de/faq/1796821588.html" title="Muss mein CSS im unteren Fall sein?" class="phphistorical_Version2_mids_title">Muss mein CSS im unteren Fall sein?</a>
<span id="377j5v51b" class="Articlelist_txts_time">Jun 19, 2025 am 12:29 AM</span>
<p class="Articlelist_txts_p">Nein, cssdoesnothavetobeinlowercase.</p>
</div>
</div>
<a href="http://miracleart.cn/de/web-designer.html" class="phpgenera_Details_mainL4_botton">
<span>See all articles</span>
<img src="/static/imghw/down_right.png" alt="" />
</a>
</div>
</div>
</div>
</main>
<footer>
<div id="377j5v51b" class="footer">
<div id="377j5v51b" class="footertop">
<img src="/static/imghw/logo.png" alt="">
<p>Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！</p>
</div>
<div id="377j5v51b" class="footermid">
<a href="http://miracleart.cn/de/about/us.html">über uns</a>
<a href="http://miracleart.cn/de/about/disclaimer.html">Haftungsausschluss</a>
<a href="http://miracleart.cn/de/update/article_0_1.html">Sitemap</a>
</div>
<div id="377j5v51b" class="footerbottom">
<p>
? php.cn All rights reserved
</p>
</div>
</div>
</footer>
<input type="hidden" id="verifycode" value="/captcha.html">
<link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css?2' type='text/css' media='all' />
<footer>
<div class="friendship-link">
<p>感谢您访问我们的网站，您可能还对以下资源感兴趣：</p>
<a href="http://miracleart.cn/" title="国产av日韩一区二区三区精品">国产av日韩一区二区三区精品</a>
<div class="friend-links">
</div>
</div>
</footer>
<script>
(function(){
var bp = document.createElement('script');
var curProtocol = window.location.protocol.split(':')[0];
if (curProtocol === 'https') {
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
}
else {
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
}
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bp, s);
})();
</script>
</body><div id="4lcrw" class="pl_css_ganrao" style="display: none;"><p id="4lcrw"><kbd id="4lcrw"><th id="4lcrw"></th></kbd></p><label id="4lcrw"></label><source id="4lcrw"></source><video id="4lcrw"></video><tfoot id="4lcrw"><pre id="4lcrw"><tfoot id="4lcrw"></tfoot></pre></tfoot><strong id="4lcrw"><dfn id="4lcrw"><em id="4lcrw"></em></dfn></strong><del id="4lcrw"></del><tr id="4lcrw"><noframes id="4lcrw"><pre id="4lcrw"></pre></noframes></tr><optgroup id="4lcrw"><td id="4lcrw"><form id="4lcrw"></form></td></optgroup><fieldset id="4lcrw"><rp id="4lcrw"><label id="4lcrw"></label></rp></fieldset><rt id="4lcrw"></rt><center id="4lcrw"></center><noframes id="4lcrw"></noframes><address id="4lcrw"></address><sup id="4lcrw"><strong id="4lcrw"><sup id="4lcrw"><tbody id="4lcrw"></tbody></sup></strong></sup><strong id="4lcrw"></strong><pre id="4lcrw"><menu id="4lcrw"><option id="4lcrw"></option></menu></pre><kbd id="4lcrw"><strong id="4lcrw"><mark id="4lcrw"></mark></strong></kbd><del id="4lcrw"></del><dl id="4lcrw"><sup id="4lcrw"><strong id="4lcrw"><address id="4lcrw"></address></strong></sup></dl><center id="4lcrw"></center><u id="4lcrw"><wbr id="4lcrw"><li id="4lcrw"></li></wbr></u><sup id="4lcrw"></sup><button id="4lcrw"></button><rt id="4lcrw"></rt><tt id="4lcrw"><center id="4lcrw"></center></tt><abbr id="4lcrw"></abbr><button id="4lcrw"><input id="4lcrw"><em id="4lcrw"></em></input></button><ruby id="4lcrw"></ruby><style id="4lcrw"><delect id="4lcrw"><small id="4lcrw"><pre id="4lcrw"></pre></small></delect></style><ins id="4lcrw"></ins><dfn id="4lcrw"></dfn><pre id="4lcrw"><ol id="4lcrw"><pre id="4lcrw"><rt id="4lcrw"></rt></pre></ol></pre><big id="4lcrw"><tbody id="4lcrw"><strike id="4lcrw"></strike></tbody></big><dd id="4lcrw"><small id="4lcrw"><progress id="4lcrw"></progress></small></dd><pre id="4lcrw"></pre><dfn id="4lcrw"><abbr id="4lcrw"><font id="4lcrw"></font></abbr></dfn><sup id="4lcrw"></sup><input id="4lcrw"></input><code id="4lcrw"><tr id="4lcrw"><nav id="4lcrw"></nav></tr></code><delect id="4lcrw"><small id="4lcrw"></small></delect><acronym id="4lcrw"></acronym><strike id="4lcrw"></strike><form id="4lcrw"><optgroup id="4lcrw"><td id="4lcrw"></td></optgroup></form><tt id="4lcrw"></tt><tt id="4lcrw"><rt id="4lcrw"><tr id="4lcrw"><strike id="4lcrw"></strike></tr></rt></tt><optgroup id="4lcrw"><td id="4lcrw"><pre id="4lcrw"></pre></td></optgroup><var id="4lcrw"><form id="4lcrw"><optgroup id="4lcrw"><blockquote id="4lcrw"></blockquote></optgroup></form></var><output id="4lcrw"></output><td id="4lcrw"><kbd id="4lcrw"><td id="4lcrw"></td></kbd></td><thead id="4lcrw"></thead><delect id="4lcrw"><small id="4lcrw"><progress id="4lcrw"></progress></small></delect><dd id="4lcrw"></dd><dfn id="4lcrw"></dfn><abbr id="4lcrw"><form id="4lcrw"><dfn id="4lcrw"><td id="4lcrw"></td></dfn></form></abbr><legend id="4lcrw"></legend><progress id="4lcrw"></progress><strong id="4lcrw"><dfn id="4lcrw"><optgroup id="4lcrw"></optgroup></dfn></strong><blockquote id="4lcrw"></blockquote><pre id="4lcrw"></pre><optgroup id="4lcrw"></optgroup><noframes id="4lcrw"></noframes><output id="4lcrw"></output><menu id="4lcrw"><font id="4lcrw"><menu id="4lcrw"><delect id="4lcrw"></delect></menu></font></menu><label id="4lcrw"></label><strike id="4lcrw"></strike><mark id="4lcrw"></mark><ol id="4lcrw"></ol><var id="4lcrw"></var><video id="4lcrw"></video><table id="4lcrw"><wbr id="4lcrw"><label id="4lcrw"></label></wbr></table><optgroup id="4lcrw"><xmp id="4lcrw"><li id="4lcrw"><tbody id="4lcrw"></tbody></li></xmp></optgroup><em id="4lcrw"><td id="4lcrw"><kbd id="4lcrw"></kbd></td></em><pre id="4lcrw"><var id="4lcrw"><form id="4lcrw"></form></var></pre><sub id="4lcrw"></sub><code id="4lcrw"></code><kbd id="4lcrw"><th id="4lcrw"><center id="4lcrw"></center></th></kbd><tfoot id="4lcrw"><track id="4lcrw"></track></tfoot><mark id="4lcrw"></mark><nobr id="4lcrw"><acronym id="4lcrw"><table id="4lcrw"></table></acronym></nobr><tr id="4lcrw"></tr><p id="4lcrw"></p><dd id="4lcrw"><abbr id="4lcrw"><thead id="4lcrw"><abbr id="4lcrw"></abbr></thead></abbr></dd><menu id="4lcrw"></menu><progress id="4lcrw"></progress><pre id="4lcrw"><rt id="4lcrw"><delect id="4lcrw"></delect></rt></pre><samp id="4lcrw"></samp><em id="4lcrw"><td id="4lcrw"><form id="4lcrw"></form></td></em><wbr id="4lcrw"></wbr><center id="4lcrw"><optgroup id="4lcrw"><blockquote id="4lcrw"></blockquote></optgroup></center><tfoot id="4lcrw"><pre id="4lcrw"><ol id="4lcrw"></ol></pre></tfoot><tfoot id="4lcrw"></tfoot><font id="4lcrw"><menu id="4lcrw"><delect id="4lcrw"><legend id="4lcrw"></legend></delect></menu></font><option id="4lcrw"></option><strike id="4lcrw"></strike><var id="4lcrw"></var><dfn id="4lcrw"></dfn><font id="4lcrw"></font><tbody id="4lcrw"><meter id="4lcrw"></meter></tbody><abbr id="4lcrw"></abbr><button id="4lcrw"></button><wbr id="4lcrw"><ul id="4lcrw"><center id="4lcrw"></center></ul></wbr><div id="4lcrw"><rp id="4lcrw"><label id="4lcrw"></label></rp></div><s id="4lcrw"></s><sup id="4lcrw"></sup><samp id="4lcrw"><tbody id="4lcrw"><meter id="4lcrw"><bdo id="4lcrw"></bdo></meter></tbody></samp><dl id="4lcrw"><sup id="4lcrw"><strong id="4lcrw"></strong></sup></dl><fieldset id="4lcrw"><output id="4lcrw"><fieldset id="4lcrw"><option id="4lcrw"></option></fieldset></output></fieldset><strong id="4lcrw"></strong><button id="4lcrw"><input id="4lcrw"><del id="4lcrw"></del></input></button><tbody id="4lcrw"><dfn id="4lcrw"><button id="4lcrw"></button></dfn></tbody><td id="4lcrw"></td><ruby id="4lcrw"></ruby><code id="4lcrw"></code><s id="4lcrw"><samp id="4lcrw"><thead id="4lcrw"></thead></samp></s><sup id="4lcrw"><table id="4lcrw"><acronym id="4lcrw"></acronym></table></sup><dfn id="4lcrw"></dfn><strong id="4lcrw"></strong><fieldset id="4lcrw"></fieldset><tr id="4lcrw"><noframes id="4lcrw"><center id="4lcrw"></center></noframes></tr><kbd id="4lcrw"><strong id="4lcrw"><mark id="4lcrw"></mark></strong></kbd><strong id="4lcrw"><fieldset id="4lcrw"><rp id="4lcrw"></rp></fieldset></strong><em id="4lcrw"></em><tbody id="4lcrw"></tbody><strong id="4lcrw"></strong><ol id="4lcrw"></ol><input id="4lcrw"><em id="4lcrw"><source id="4lcrw"></source></em></input><thead id="4lcrw"></thead><dfn id="4lcrw"><listing id="4lcrw"><pre id="4lcrw"><abbr id="4lcrw"></abbr></pre></listing></dfn><table id="4lcrw"><wbr id="4lcrw"><li id="4lcrw"></li></wbr></table><u id="4lcrw"><center id="4lcrw"><ins id="4lcrw"></ins></center></u><track id="4lcrw"><tfoot id="4lcrw"></tfoot></track><optgroup id="4lcrw"><td id="4lcrw"><style id="4lcrw"><progress id="4lcrw"></progress></style></td></optgroup><kbd id="4lcrw"></kbd><s id="4lcrw"></s><code id="4lcrw"></code><small id="4lcrw"></small><li id="4lcrw"><dl id="4lcrw"><th id="4lcrw"></th></dl></li><u id="4lcrw"></u><b id="4lcrw"><i id="4lcrw"></i></b><form id="4lcrw"></form><kbd id="4lcrw"></kbd><noframes id="4lcrw"></noframes><legend id="4lcrw"><li id="4lcrw"><tbody id="4lcrw"><listing id="4lcrw"></listing></tbody></li></legend><pre id="4lcrw"></pre><th id="4lcrw"><dl id="4lcrw"></dl></th><tfoot id="4lcrw"><pre id="4lcrw"><ol id="4lcrw"></ol></pre></tfoot><s id="4lcrw"><samp id="4lcrw"><strong id="4lcrw"></strong></samp></s></div>
</html>