Heim  >  Artikel  >  Web-Frontend  >  HTML-Anfängerleitfaden (1)

HTML-Anfängerleitfaden (1)

黄舟
黄舟Original
2016-12-23 14:40:231040Durchsuche

Dieser Artikel ist eine Einführung in die Erstellung von HTML-Dateien. HTML ist die Hypertext-Auszeichnungssprache, die im WWW (World Wide Web) verwendet wird. Der Zweck dieses Leitfadens besteht darin, eine Einführung in die Verwendung von HTML und die Erstellung von Webdokumenten zu geben. Die Links in diesem Artikel führen zu einigen zusätzlichen Informationen. Sie können auch in Ihrem örtlichen Buchladen vorbeischauen, der möglicherweise viele wertvolle Informationen über das Web und HTML bietet.
Vorwort
Begriffe
WWW
World Wide Web
Web
World Wide Web
SGML
Standard Generalized Markup Language – Standard Generalized Markup Language, Beschreibung der Auszeichnungssprache Eine standardmäßige
DTD
Dokumenttypdefinition – Texttypdefinition, die eine formale Beschreibung einer Auszeichnungssprache ist, die in SGML geschrieben ist.
HTML
HyperText Markup Language – Hypertext Markup Language, es ist eine SGML DTD
HTML ist eine Reihe plattformunabhängiger Formatdefinitionen (spezifiziert mit Tags), die zur Beschreibung verschiedener Komponenten in World Wide Web-Dokumenten verwendet werden. HTML wurde von Tim Berners-Lee am CERN (European Particle Physics Experiment in Geneva) entwickelt. .
Inhalte, die nicht in diesem Artikel enthalten sind
Dieses Handbuch setzt voraus, dass der Leser über die folgenden Grundlagen verfügt:

Kenntnisse im Umgang mit NCSA-Mosaik oder anderen Webbrowsern
Erfahrung mit Webservern und Clients Browser Allgemeines Verständnis
Sie haben Zugriff auf einen Webserver (oder Sie möchten einfach nur lokal HTML-Dokumente für den persönlichen Gebrauch erstellen)
HTML-Version
Diese Anleitung bezieht sich auf die neuesten Anweisungen – HTML 2.0 – und einige davon sind bereits in vielen Browsern implementiert. Außerdem sind einige neue Funktionen in der Entwicklung.

HTML-Dokument
Was ist ein HTML-Dokument?
HTML-Dokument ist eine gewöhnliche Textdatei (ASCII). kann in jedem beliebigen Textverarbeitungsprogramm bearbeitet werden. Denken Sie jedoch daran, die Datei als „einfacher Text mit Wagenrücklauf“ zu speichern.

HTML-Editor
Es stehen einige WYSIWYG-Editoren zur Verfügung (z. B. HotMetal für mehrere Plattformen oder Adobe PageMill für Macintosh). Nachdem Sie sich später einige Grundkenntnisse über HTML-Markup angeeignet haben, möchten Sie diese möglicherweise verwenden . Es kann hilfreich sein, über ausreichende Kenntnisse der HTML-Codierung zu verfügen, um festzustellen, ob ein WYSIWYG-Editor geeignet ist.

Wenn Sie sich noch nicht für die zu verwendende Software entschieden haben, können Sie sich diesen Artikel ansehen. Online-Beispielliste für Website-Software Laden Sie HTML-Editoren herunter (kategorisiert nach Anwendungsplattform), um Ihnen bei der Suche nach Anwendungssoftware zu helfen.

Speichern Sie die Datei auf dem Server.
Wenn Sie in der Schule oder bei der Arbeit sind, können Sie auf den Webserver zugreifen und Ihr WEB kontaktieren Administrator-Webmaster (die Person, die den Server verwaltet), um zu sehen, wie Sie Ihre Dateien im Web speichern. Wenn Sie in der Schule oder am Arbeitsplatz nicht darauf zugreifen können, können Sie sehen, ob Ihre Community über ein kostenloses Netzwerk namens FreeNet verfügt, ein A-Community-Netzwerk. Wenn kein kostenloses Internet verfügbar ist, können Sie sich gegen eine Gebühr an Ihren lokalen Internetanbieter wenden. Dieser kann Ihre Dokumente auf dem Server speichern Handelskammer für Firmennamen.)

Tag-Beschreibung
Ein Element ist die Grundkomponente einer Dokumentstruktur. Beispiele für Elemente sind Überschriften, Tabellen, Absätze, Listen usw. Sie können sich vorstellen Gehen Sie folgendermaßen vor: Sie verwenden HTML-Tags, um jedes Element der Datei für den Browser zu markieren. Elemente können normalen Text, andere Elemente oder beides enthalten.

Tags werden zur Darstellung verschiedener HTML-Tags verwendet bestehen aus einer linken spitzen Klammer (<), einem Tag-Namen und einer rechten spitzen Klammer (>), um den Umfang anzuzeigen Das schließende Tag ähnelt dem öffnenden Tag, außer dass dem Tag-Namen in Klammern ein Schrägstrich (/) vorangestellt ist. Einige Elemente enthalten möglicherweise ein Attribut sind zusätzliche Informationen, die im Eröffnungs-Tag enthalten sind. Sie können beispielsweise die Position eines Bildes (oben, in der Mitte oder unten) angeben, indem Sie die entsprechenden Attribute in den HTML-Code der Bilddatei einfügen

Hinweis: Bei HTML wird die Groß-/Kleinschreibung nicht beachtet. Es gibt einige Ausnahmen, die unten in der Escape-Sequenz aufgeführt sind >Nicht alle World Wide Web-Browser unterstützen ein Tag, das normalerweise ignoriert wird.

Mindest-HTML-Dokument
Jedes HTML-Dokument sollte einige Standard-HTML-Tags enthalten enthält zwei Teile: Kopf- und Haupttext, und der Hauptteil enthält den Text, der tatsächlich Absätze, Listen und andere Elemente darstellt. Browser benötigen spezifische Informationen, da sie gemäß den HTML- und SGML-Spezifikationen programmiert sind
Das folgende Quelldokument veranschaulicht die erforderlichen Elemente:


< head>
Ein einfaches HTML-Beispiel


HTML ist leicht zu erlernen


Willkommen in der Welt von HTML
Dies ist der erste Absatz, obwohl er
immer noch ein Absatz ist!


Und dies ist der zweite Absatz.





Erforderliche Elemente sind , , und <body> Tags (und ihre entsprechenden Schluss-Tags) Da Sie diese Tags in jede Datei einfügen müssen, können Sie eine Vorlagendatei erstellen, die diese Tags enthält. (Einige Browser normalisieren Ihre HTML-Dateien automatisch korrekt. Auch wenn Sie diese Tags nicht einfügen . Aber einige Browser tun dies nicht! Sie müssen also sicherstellen, dass Sie diese Tags einschließen.) </p> <p> Das Obige ist der Inhalt des HTML-Anfängerleitfadens (1). Für weitere verwandte Inhalte achten Sie bitte auf PHP Chinesisches Netz (www.php.cn)! <br></p> <p><br></p></div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>Stellungnahme:</span><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><div class="nphpSytBox"><span>Vorheriger Artikel:<a class="dBlack" title="Die Rolle des Dir-Attributs in HTML-Tags." href="http://m.php.cn/de/faq/346129.html">Die Rolle des Dir-Attributs in HTML-Tags.</a></span><span>Nächster Artikel:<a class="dBlack" title="Die Rolle des Dir-Attributs in HTML-Tags." href="http://m.php.cn/de/faq/346271.html">Die Rolle des Dir-Attributs in HTML-Tags.</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>In Verbindung stehende Artikel</h2><em><a href="http://m.php.cn/de/article.html" class="bBlack"><i>Mehr sehen</i><b></b></a></em><div class="clear"></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-6t+ed+2i-1n-4w" data-ad-client="ca-pub-5902227090019525" data-ad-slot="8966999616"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><ul class="nphpXgwzList"><li><b></b><a href="http://m.php.cn/de/faq/348757.html" title="Zusammenfassung der HTML-Kenntnisse" class="aBlack">Zusammenfassung der HTML-Kenntnisse</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/de/faq/348804.html" title="So lernen Sie schnell HTML" class="aBlack">So lernen Sie schnell HTML</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/de/faq/348873.html" title="Der Unterschied zwischen HTML xHTML XML" class="aBlack">Der Unterschied zwischen HTML xHTML XML</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/de/faq/348884.html" title="Der Unterschied zwischen src- und href-Attributen" class="aBlack">Der Unterschied zwischen src- und href-Attributen</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/de/faq/348902.html" title="Über die Verwendung von HTML5 und CSS-Ersatz" class="aBlack">Über die Verwendung von HTML5 und CSS-Ersatz</a><div class="clear"></div></li></ul></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="5027754603"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><div class="nphpFoot"><div class="nphpFootBg"><ul class="nphpFootMenu"><li><a href="http://m.php.cn/de/"><b class="icon1"></b><p>Heim</p></a></li><li><a href="http://m.php.cn/de/course.html"><b class="icon2"></b><p>Kurs</p></a></li><li><a href="http://m.php.cn/de/wenda.html"><b class="icon4"></b><p>Fragen und Antworten</p></a></li><li><a href="http://m.php.cn/de/login"><b class="icon5"></b><p>Mein</p></a></li><div class="clear"></div></ul></div></div><div class="nphpYouBox" style="display: none;"><div class="nphpYouBg"><div class="nphpYouTitle"><span onclick="$('.nphpYouBox').hide()"></span><a href="http://m.php.cn/de/"></a><div class="clear"></div></div><ul class="nphpYouList"><li><a href="http://m.php.cn/de/"><b class="icon1"></b><span>Heim</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/de/course.html"><b class="icon2"></b><span>Kurs</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/de/article.html"><b class="icon3"></b><span>Artikel</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/de/wenda.html"><b class="icon4"></b><span>Fragen und Antworten</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/de/dic.html"><b class="icon6"></b><span>Wörterbuch</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/de/course/type/99.html"><b class="icon7"></b><span>Handbuch</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/de/xiazai/"><b class="icon8"></b><span>Herunterladen</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/de/faq/zt" title="Thema"><b class="icon12"></b><span>Thema</span><div class="clear"></div></a></li><div class="clear"></div></ul></div></div><div class="nphpDing" style="display: none;"><div class="nphpDinglogo"><a href="http://m.php.cn/de/"></a></div><div class="nphpNavIn1"><div class="swiper-container nphpNavSwiper1"><div class="swiper-wrapper"><div class="swiper-slide"><a href="http://m.php.cn/de/" >Heim</a></div><div class="swiper-slide"><a href="http://m.php.cn/de/article.html" class="hover">Artikel</a></div><div class="swiper-slide"><a href="http://m.php.cn/de/wenda.html" >Fragen und Antworten</a></div><div class="swiper-slide"><a href="http://m.php.cn/de/course.html" >Kurs</a></div><div class="swiper-slide"><a href="http://m.php.cn/de/faq/zt" >Thema</a></div><div class="swiper-slide"><a href="http://m.php.cn/de/xiazai" >Herunterladen</a></div><div class="swiper-slide"><a href="http://m.php.cn/de/game" >Spiel</a></div><div class="swiper-slide"><a href="http://m.php.cn/de/dic.html" >Wörterbuch</a></div><div class="clear"></div></div></div><div class="langadivs" ><a href="javascript:;" class="bg4 bglanguage"></a><div class="langadiv" ><a onclick="javascript:setlang('zh-cn');" class="language course-right-orders chooselan " href="javascript:;"><span>简体中文</span><span>(ZH-CN)</span></a><a onclick="javascript:setlang('en');" class="language course-right-orders chooselan " href="javascript:;"><span>English</span><span>(EN)</span></a><a onclick="javascript:setlang('zh-tw');" class="language course-right-orders chooselan " href="javascript:;"><span>繁体中文</span><span>(ZH-TW)</span></a><a onclick="javascript:setlang('ja');" class="language course-right-orders chooselan " href="javascript:;"><span>日本語</span><span>(JA)</span></a><a onclick="javascript:setlang('ko');" class="language course-right-orders chooselan " href="javascript:;"><span>한국어</span><span>(KO)</span></a><a onclick="javascript:setlang('ms');" class="language course-right-orders chooselan " href="javascript:;"><span>Melayu</span><span>(MS)</span></a><a onclick="javascript:setlang('fr');" class="language course-right-orders chooselan " href="javascript:;"><span>Français</span><span>(FR)</span></a><a onclick="javascript:;" class="language course-right-orders chooselan chooselanguage" href="javascript:;"><span>Deutsch</span><span>(DE)</span></a></div></div><script> var swiper = new Swiper('.nphpNavSwiper1', { slidesPerView : 'auto', observer: true,//修改swiper自己或子元素时,自动初始化swiper observeParents: true,//修改swiper的父元素时,自动初始化swiper }); </script></div></div><!--顶部导航 end--><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了,就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body></html>