HTML, was für „Hypertext Markup Language“ steht, ist eine Standardsprache, die zum Erstellen von Webseiten verwendet wird. Es verwendet Markup (HTML-Tags), um verschiedene Elemente wie Text, Bilder, Links, Tabellen usw. zu definieren und diese Elemente zu einer Webseite zu organisieren. In diesem Artikel werden die grundlegende Syntax, Tags, Elemente, Attribute und andere verwandte Kenntnisse von HTML vorgestellt und erläutert, wie diese Kenntnisse zum Erstellen von Webseiten verwendet werden können.
- Grundsätzliche Syntax von HTML
HTML besteht aus einer Reihe von Tags und Text. Die grundlegende Syntax lautet wie folgt:
<!DOCTYPE html> <!-- 声明文档类型 -->
<html> <!-- HTML文档的根元素 -->
<head> <!-- 定义文档头部 -->
<title>网页标题</title> <!-- 定义网页标题 -->
</head>
<body> <!-- 定义文档主体 -->
<!-- 此处可以插入文本、图像、链接等各种元素 -->
</body>
</html>
Darunter deklariert „“ den Dokumenttyp als HTML5-Standard, „“ ist das Stammelement des HTML-Dokuments und „< head>“ definiert den Dokumentkopf. Wird im Allgemeinen zum Definieren von Titel, Stil, Skript und anderen Informationen der Webseite verwendet. „
“ definiert den Titel der Webseite. „<body>“ ist der Hauptteil des Dokuments und wird zur Definition verschiedener Elemente wie Text, Bilder, Links usw. verwendet. </p>
<ol start="2"><li>HTML-Tags und -Elemente </li></ol>
<p> Tags in HTML werden in spitze Klammern (< >) eingeschlossen und erscheinen normalerweise paarweise, jeweils mit einem Start-Tag und einem End-Tag. Beispielsweise ist „<p>“ ein Start-Tag, das einen Absatz definiert, während „</p>“ ein Schluss-Tag ist. </p>
<p>Es gibt auch einige einzelne Tags in HTML, die nur ein Tag haben, aber kein schließendes Tag benötigen. Zum Beispiel wird „<img>“ verwendet, um ein Bild einzufügen, und seine Syntax lautet wie folgt: </p>
<pre class="brush:php;toolbar:false"><img src="图片地址" alt="图片描述"></pre>
<p> Unter diesen gibt das Attribut „src“ die URL-Adresse des Bildes und das Attribut „alt“ an Beschreibungsinformationen des Bildes. </p>
<ol start="3"><li>Attribute von HTML</li></ol>
<p>HTML-Tags können auch Attribute enthalten, bei denen es sich um zusätzliche Informationen zur Beschreibung von Elementen handelt. Beispielsweise wird das Tag „<a>“ zum Erstellen eines Links verwendet und seine Syntax lautet wie folgt: </a></p>
<pre class="brush:php;toolbar:false"><a href="链接地址">链接文本</a></pre>
<p> Unter anderem gibt das Attribut „href“ die URL-Adresse des Links an und der „Linktext“ ist die Text, den der Benutzer auf der Seite sieht. </p>
<p>Neben dem „href“-Attribut gibt es viele weitere häufig verwendete Attribute. Beispielsweise werden die Attribute „class“ und „id“ verwendet, um Elemente zu identifizieren und zu klassifizieren, damit sie durch Stylesheets und JavaScript-Skripte leicht zugänglich und einfach zu bearbeiten sind. Die Syntax lautet wie folgt: </p>
<pre class="brush:php;toolbar:false"><div class="class名称" id="id名称">元素内容</div></pre>
<ol start="4"><li>Ein Beispiel für die Erstellung einer einfachen Webseite</li></ol>
<p>Das Folgende ist ein Beispiel für eine einfache Webseite, die mit HTML erstellt wurde:</p>
<pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
<title>我的第一个网页</title>
<style>
body {
background-color: #E6E6FA;
font-family: Arial, sans-serif;
}
h1 {
color: blue;
}
</style>
</head>
<body>
<h1>欢迎访问我的第一个网页！</h1>
<p>这是一个由HTML制作的简单网页示例。</p>
<h2>利用HTML制作网页的步骤：</h2>
<ol>
<li>学习HTML基本语法、标签和属性。</li>
<li>创建HTML文件，用文本编辑器编辑文件代码。</li>
<li>保存HTML文件，用浏览器打开并查看网页效果。</li>
</ol>
<p>祝大家学习愉快，制作美丽的网页！</p>
</body>
</html></pre>
<p>Diese Webseite verwendet verschiedene Elemente wie Titel, Absätze, Stile und Listen usw. in HTML. Unter anderem wird das Tag „<style>“ verwendet, um den Stil der Webseite zu definieren, das Attribut „background-color“ gibt die Hintergrundfarbe an, das Attribut „font-family“ gibt die Schriftfamilie an und das Attribut „< Das Tag „;ol>“ wird zum Erstellen einer geordneten Liste verwendet. </p>
<ol start="5"><li>Zusammenfassung</li></ol>
<p>HTML ist eine der grundlegenden Sprachen zum Erstellen von Webseiten. Wenn Sie die grundlegende Syntax, Tags, Elemente und Attribute von HTML beherrschen, können Sie schöne und effektive Webseiten erstellen. Ich hoffe, dieser Artikel kann Ihnen beim Erlernen von HTML helfen und wünsche Ihnen, dass Sie schöne Webseiten schreiben! </p><p>Das obige ist der detaillierte Inhalt vonWie man HTML erstellt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!</p></div><div class="nphpQianMsg"><a href="javascript:void(0);">JavaScript</a> <a href="javascript:void(0);">html5</a> <a href="javascript:void(0);">html</a> <a href="javascript:void(0);">class</a> <a href="javascript:void(0);">href</a> <a href="javascript:void(0);">样式表</a> <a href="javascript:void(0);">background</a><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="Wie man HTML erstellt" href="https://m.php.cn/de/faq/526516.html">Wie man HTML erstellt</a></span><span>Nächster Artikel：<a class="dBlack" title="Wie man HTML erstellt" href="https://m.php.cn/de/faq/526520.html">Wie man HTML erstellt</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>In Verbindung stehende Artikel</h2><em><a href="https://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="https://m.php.cn/de/faq/402895.html" title="Problem beim Übergeben von Werten von der übergeordneten Komponente an die untergeordneten Komponenten-Echarts in Vue" class="aBlack">Problem beim Übergeben von Werten von der übergeordneten Komponente an die untergeordneten Komponenten-Echarts in Vue</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/de/faq/402896.html" title="Einige Gedanken zu React diese Bindung" class="aBlack">Einige Gedanken zu React diese Bindung</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/de/faq/402897.html" title="Django verwendet eine Anfrage, um die vom Browser gesendeten Parameter abzurufen" class="aBlack">Django verwendet eine Anfrage, um die vom Browser gesendeten Parameter abzurufen</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/de/faq/402898.html" title="DOM-Operation in JQuery – Wrap" class="aBlack">DOM-Operation in JQuery – Wrap</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/de/faq/402899.html" title="Erläuterung verwandter Inhalte von Prototyp und Prototypenkette" class="aBlack">Erläuterung verwandter Inhalte von Prototyp und Prototypenkette</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><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！</p></div><div class="footermid"><a href="https://m.php.cn/de/about/us.html">Über uns</a><a href="https://m.php.cn/de/about/disclaimer.html">Haftungsausschluss</a><a href="https://m.php.cn/de/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved
</p></div></div></footer><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><!-- Matomo --><script> var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="https://tongji.php.cn/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '9']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script><!-- End Matomo Code --></html>
