Heim > Web-Frontend > HTML-Tutorial > Detaillierte Beschreibung von HTML-Webseiten-Header-Codebeispielen

Detaillierte Beschreibung von HTML-Webseiten-Header-Codebeispielen

高洛峰
Freigeben: 2017-03-09 16:15:03
Original
3301 Leute haben es durchsucht

In HTML nennen wir diesen Teil im Allgemeinen den Kopf einer Webseite. Obwohl der Inhalt der Kopfzeile nicht auf der Seite angezeigt wird, kann er sich auf die Aufnahme und Sortierung von Webseiten durch Suchmaschinen sowie auf verschiedene globale Einstellungen von Webseiten auswirken, was als entscheidend bezeichnet werden kann

Wissenspunkt 1: Festlegen der Basis-URL der Webseite in den Header-Informationen

Der Kern der Basis-URL besteht darin, die Attribute des Hyperlinks einheitlich festzulegen , das zwei Attribute hat: href und _target. href wird verwendet, um den Pfad der Basis-URL festzulegen, und _target wird verwendet, um die Öffnungsmethode des Hyperlinks festzulegen.

Durch Hinzufügen der Basis-URL können alle relativen Website-Stammadressen auf der Seite in absolute Adressen umgewandelt werden. Wenn der Browser die Seite durchsucht, werden die relative Website- und Verzeichnisadresse über das -Tag an den Basis-URL-Pfad angehängt und dadurch in eine absolute Adresse umgewandelt. Wir erstellen zunächst eine base.htm und schreiben den HTML-Code wie folgt:

Der Code lautet wie folgt:

<html> 
<head> 
<title>基底网址的设置</title> 
<base href="<a href="//m.sbmmt.com">//m.sbmmt.com/;/a>" _target="_blank" /> 
</head> 
<body> 
</body> 
</html>
Nach dem Login kopieren

Legen Sie die Basis-URL über den obigen Code fest. Vor der Adresse jedes Hyperlinks auf der Base.htm-Seite steht „http://www.jb51.net“, was in eine absolute Adresse umgewandelt wird. Darüber hinaus werden die Hyperlinks auf der Seite in neuen Fenstern geöffnet.

Wissenspunkt 2: Metainformations-Tag von Header-Informationen

Meta-Informations-Tag ist das grundlegende Tag von Header-Informationen. Metainformationen werden in professionellen Webseitencodes detailliert beschrieben . aufstellen. Das Metainformations-Tag ist , wobei es sich um ein einzelnes Tag handelt. Die vom Meta-Element bereitgestellten Informationen sind für durchsuchende Benutzer unsichtbar und werden im Allgemeinen zur Definition des Namens, der Schlüsselwörter, des Autors usw. von Seiteninformationen verwendet. In einer HTML-Seite enthält ein Meta-Tag einen Meta-Inhalt, und eine HTML-Header-Seite kann mehrere Meta-Elemente enthalten.

Es gibt zwei Arten von Meta-Tag-Attributen: Seitenbeschreibungsattribut (Name) und http-Titelinformationen (http-äquiv).

Namensattribut

Das Namensattribut wird hauptsächlich zur Beschreibung des Inhalts der Webseite verwendet und dient der Suchmaschinenoptimierung. Es muss beherrscht werden. Stellen Sie das Namensattribut richtig ein, damit die Suchroboter von Suchmaschinen (wie Google, Baidu) im Allgemeinen automatisch Metawerte finden und klassifizieren können. Der Wert des Namens ist wie folgt:

<1>keywords. Das heißt, Schlüsselwörter werden verwendet, um die auf der Webseite enthaltenen Schlüsselwörter und andere Informationen zu beschreiben, wodurch die Wahrscheinlichkeit erhöht wird, von Suchmaschinen durchsucht zu werden. Das Schreibformat ist und der Wert des Inhaltsattributs ist das vom Benutzer festgelegte spezifische Schlüsselwort. (Im Allgemeinen können mehrere Schlüsselwörter festgelegt werden, getrennt durch englische Kommas halber Breite. Suchmaschinen begrenzen die Anzahl der Schlüsselwörter, daher sollte der Schlüsselwortinhalt prägnant und prägnant sein.)

<2>Beschreibung. Es bedeutet auf Chinesisch „Beschreibung“ und wird verwendet, um den Hauptinhalt, das Thema usw. einer Webseite zu beschreiben. Angemessene Einstellungen können auch die Wahrscheinlichkeit erhöhen, von Suchmaschinen durchsucht zu werden. Das Format ist . Der Inhaltsattributwert ist die vom Benutzer festgelegte spezifische Beschreibung der Seite. Er kann bis zu 1024 Zeichen aufnehmen, aber die Suche Die Engine zeigt nur etwa die erste Hälfte der Seite an.

<3>Autor. Autor: Wird verwendet, um den Namen des Website-Autors festzulegen, der häufig von professionelleren Websites verwendet wird. Das Format ist

<4>generator. Der Generator wird zum Festlegen des Namens des Website-Bearbeitungstools verwendet und wird häufig auf professionelleren Website-Seiten verwendet. Format

<5>robots. Bots werden verwendet, um die Art und Weise, wie Seiten durchsucht werden, einzuschränken. Der Suchroboter der Suchmaschine ruft kontinuierlich Informationen ab und baut entlang der Links auf der Webseite (z. B. http- und src-Links) eine eigene Datenbank auf. Dieses Meta-Tag kann die Erkennung einiger Inhalte durch Suchmaschinen einschränken und die Offenlegung einiger Informationen verringern. Das Schreibformat ist . Der Wert dieses Attributs enthält 4 Befehle, nämlich index, noindex, follow und nofollow. Je nach Anordnung und Kombination gibt es 4 Kombinationen. Die Kombination aus Index und Follow kann auch als All bezeichnet werden, und Noindex und Nofollow können auch als None bezeichnet werden.

http-equiv-Attribut

Der Wert des http-equiv-Attributs ist wie folgt:

<1>content-type, Inhaltskategorie , verwenden Sie den Kategorie- und Sprachzeichensatz für die Einstellungsseite. Schreibformat , der Wert des Inhaltsattributs gibt an, dass die Seite im HTML-Code ausgegeben wird, und das Zeichen Der Satz ist gb2312 (vereinfachtes Chinesisch). Für die Entwicklung internationaler Websites wird zur Vereinheitlichung der Zeichen die Verwendung von utf-8 empfohlen.

<2>aktualisieren für den Zeichensatz. Mit „Aktualisieren“ wird festgelegt, wie lange sich die Webseite selbst aktualisiert oder innerhalb eines bestimmten Zeitraums automatisch zu anderen Seiten springt. Das erste Schreibformat bedeutet Intervall „Einmal aktualisieren“. alle 30 Sekunden. Das zweite Schreibformat ist , was bedeutet, dass die Seite nach 30 Sekunden automatisch zu www.google springt .com-Website

<3>expires,中文意思为“到期”,用于设置页面到期时间。一旦网页过期,必须到服务器上重新调用网页。第一种编写格式为,content值代表网页过期的时间,必须使用GMT时间格式。第二种编写格式为,表示多少秒后过期。

<4>cache-control,缓存控制。用于禁止在缓存中调用网页,编写格式为,no-cache代表不允许缓存。

<5>set-cookie,设置cookie,用于设置本页面cookie多久过期,编写格式为,代表到这个时间,cookie将被删除。


知识点三:头部信息实现与CSS及JavaScript混编

CSS负责HTML网页的样式,JaveScript负责HTML网页的动态行为。CSS和JaveScript最常用的融合方式是写入头部信息部分。
<1>加入CSS只需在头部信息中加入标签对。范例代码如下

代码如下:

<html> 
<head> 
<title>CSS的设置</title> 
<style type=“text/css”> 
CSS具体内容 
</style> 
</head> 
<body> 
</body> 
</html>
Nach dem Login kopieren

<2>加入JavaScript只需要在头部信息中加入标签对。范例代码如下:

代码如下:

<html> 
<head> 
<title>CSS的设置</title> 
<style type=“text/css”> 
CSS具体内容 
</style> 
<script type=“text/javascript”> 
JavaScript具体内容 
</script> 
</head> 
<body> 
</body> 
</html>
Nach dem Login kopieren

知识点四:常用头部信息功能推荐

<1>页面切换特效,其中一种特效的编写格式如下:

代码如下:

<meta http-equiv=“page-enter” content=“blendtrans(duration=0.5)”/>
Nach dem Login kopieren

http-equiv属性的值为page-enter时表进入该页面时启用特效,http-equiv属性的值为page-exit时代表退出(离开)该页面时启用特效。

Content属性的值代表特效的种类,这种特效也叫动态滤镜。滤镜种类很多,比如blendtrans就是很常见得一种,效果为淡入淡出,duration值表示效果持续的时间(单位为秒)。

另一种滤镜特效编写格式如下:

代码如下:

<meta http-equiv=“page-enter” content=“revealTrans(duration=6)”/>
Nach dem Login kopieren

动态滤镜revealTrans也可用于页面进入与退出效果。Duration表示滤镜特效持续时间(单位为秒),Transition是滤镜类型,表示想使用哪种特效,取值为0~23。

<2>强制页面在当前窗口以独立页面显示,可以防止网页被其他网站框架,编写格式如下:

代码如下:

<meta http-equiv="window-target" content=“_top">
Nach dem Login kopieren

<3>页面图标设置,编写格式如下:

代码如下:

<link rel="Shortcut Icon" href="/myicon.ico">
Nach dem Login kopieren

href属性的值是ico图标文件的路径,这里采用的是相对根目录路径

Das obige ist der detaillierte Inhalt vonDetaillierte Beschreibung von HTML-Webseiten-Header-Codebeispielen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage