Heim > Web-Frontend > HTML-Tutorial > Codierungsspezifikationen für HTML und CSS

Codierungsspezifikationen für HTML und CSS

WBOY
Freigeben: 2016-08-30 09:21:06
Original
1132 Leute haben es durchsucht

HTML- und CSS-Codierungsspezifikationsinhalt

1. HTML-Spezifikationen

2. CSS-Spezifikationen

3. Dinge zu beachten:

4. Allgemeine Namensregeln

5. Benennung der CSS-Stylesheet-Dateien

6. Regeln zur Dateibenennung

1. HTML-Spezifikation:

1. Code-Spezifikationen

  • Fügen Sie die Standardmodus-Deklaration
  • zur ersten Zeile der Seite hinzu
  • Code-Einrückung: Legen Sie mit der Tabulatortaste vier Leerzeichen fest (stellen Sie normalerweise die entsprechende Leerzeichengröße in der unteren rechten Ecke der Software ein)
  • Außer dem DOC und „UTF-8“ am Anfang oder dem Sonderfall im Kopf, der großgeschrieben werden kann, ist alles andere in Kleinbuchstaben geschrieben, und die CSS-Klassen sind alle in Kleinbuchstaben geschrieben
  • Es wird empfohlen, das lang-Attribut für das HTML-Stammelement anzugeben, um die richtige Sprache für das Dokument lang="zh-CN" festzulegen
  • Unterschiedliche Dokumenttypen lösen in verschiedenen Browsern unterschiedliche Rendering-Modi aus
<code class="hljs xml"><span class="hljs-doctype"><!DOCTYPE html>
<span class="hljs-tag"><<span class="hljs-title">html <span class="hljs-attribute">lang=<span class="hljs-value">"zh-CN">
  <span class="hljs-tag"><<span class="hljs-title">head>
      <span class="hljs-tag"><<span class="hljs-title">meta <span class="hljs-attribute">charset=<span class="hljs-value">"UTF-8">
      <span class="hljs-tag"><<span class="hljs-title">meta <span class="hljs-attribute">http-equiv=<span class="hljs-value">"X-UA-Compatible" <span class="hljs-attribute">content=<span class="hljs-value">"IE=Edge">
  <span class="hljs-tag"></<span class="hljs-title">head>
  ....
<span class="hljs-tag"></<span class="hljs-title">html>
</span></span></span></span></span></span></span></code>
Nach dem Login kopieren
  • Verwenden Sie nicht @import
    • Im Vergleich zum -Tag ist der @import-Befehl viel langsamer, was nicht nur die Anzahl zusätzlicher Anfragen erhöht, sondern auch unvorhersehbare Probleme verursacht. Zu den Alternativen gehören:
      • Verwenden Sie mehrere -Elemente
      • Kompilieren Sie mehrere CSS-Dateien über einen CSS-Präprozessor wie Sass oder Less zu einer Datei
      • Funktion zum Zusammenführen von CSS-Dateien, bereitgestellt über Rails, Jekyll oder andere Systeme
<code class="hljs xml"><span class="hljs-comment"><!-- Use link elements -->
<span class="hljs-tag"><<span class="hljs-title">link <span class="hljs-attribute">rel=<span class="hljs-value">"stylesheet" <span class="hljs-attribute">href=<span class="hljs-value">"core.css">

<span class="hljs-comment"><!-- Avoid @imports -->
<span class="hljs-tag"><<span class="hljs-title">style><span class="css">
  <span class="hljs-at_rule">@<span class="hljs-keyword">import <span class="hljs-function">url(<span class="hljs-string">"more.css");
<span class="hljs-tag"></<span class="hljs-title">style>
</span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></code>
Nach dem Login kopieren


CSS- und JavaScript-Dateien einführen
  • Gemäß der HTML5-Spezifikation besteht bei der Einführung von CSS und JS normalerweise keine Angabe des Typs, da text/css bzw. text/javascript ihre Standardwerte sind
<code class="hljs xml"><span class="hljs-comment"><!-- External CSS -->
<span class="hljs-tag"><<span class="hljs-title">link <span class="hljs-attribute">rel=<span class="hljs-value">"stylesheet" <span class="hljs-attribute">href=<span class="hljs-value">"code-guide.css">

<span class="hljs-comment"><!-- In-document CSS -->
<span class="hljs-tag"><<span class="hljs-title">style><span class="css">
 <span class="hljs-comment">/* ... */
<span class="hljs-tag"></<span class="hljs-title">style>

<span class="hljs-comment"><!-- JavaScript -->
<span class="hljs-tag"><<span class="hljs-title">script <span class="hljs-attribute">src=<span class="hljs-value">"code-guide.js"><span class="undefined"><span class="hljs-tag"></<span class="hljs-title">script>
</span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></code>
Nach dem Login kopieren

2. Kommentare


  • Hinweis: Lassen Sie nach dem -- kein Leerzeichen. Wenn Sie ein Leerzeichen hinterlassen, fügen Sie allen anderen Kommentaren Leerzeichen hinzu (um die spätere Programmentwicklung zu erleichtern). Mit anderen Worten: Die Kommentare müssen global einheitlich sein

zB:


ist eine Schreibvorgabe, es ist am besten, jeden Kommentar einzuschließen Das muss am Anfang und Ende gemacht werden, um spätere Probleme und Fehler zu reduzieren. Wickeln Sie die Leine nicht um. Das Gleiche gilt für CSS- und JS-Kommentare.



ist eine Schreibspezifikation, vorzugsweise alle benötigten Kommentare Sie müssen einen Anfang und ein Ende haben, um spätere Probleme und Fehler zu vermeiden. Wickeln Sie die Leine nicht um. Das Gleiche gilt für CSS- und JS-Kommentare.