HTML code specification

HTML code specification

1. Grammar

1. Use two spaces instead of tabs (tab)
2. Nested elements should be indented once (ie, two spaces).
3. For property definitions, be sure to use double quotes, never single quotes.
4. Do not omit optional closing tags (eg, </li>or </body>).

2. IE Compatibility Mode

Labels are added to each page <meta>to tell IE to use the latest mode it supports.
<meta http-equiv="X-UA-Compatible" content="IE=Edge">

3. Character encoding

Each page is <meta>tagged so that it all matches the document encoding (usually UTF-8).
<meta charset="UTF-8">

Fourth, the introduction of CSS and JavaScript files

According to the HTML5 specification, the type attribute generally does not need to be specified when importing CSS and JavaScript files, because text/css and text/javascript are their default values ​​respectively.

5. Attribute order

HTML attributes should be listed in the order given below to ensure code readability.

1.class
2.id, name
3.data-*
4.src, for, type, href
5.title, alt
6.aria-*, role

example:

<a class="..." id="..." data-modal="toggle" href="#">
  Example link
</a>
<input class="form-control" type="text">
<img src="..." alt="...">

6. Boolean attributes

Boolean properties can be declared without assignment. The XHTML specification requires it to be assigned a value, but the HTML5 specification does not.
Simply put, no assignment is required.
example:

<input type="text" disabled>
<input type="checkbox" value="1" checked>
<select>
  <option value="1" selected>1</option>
</select>

7. Reduce the number of labels

When writing HTML code, try to avoid redundant parent elements. Many times this requires iteration and refactoring to achieve. Please see the following case:

<!-- 不好的 -->
<span class="avatar">
  <img src="...">
</span>

<!-- 好的 -->
<img class="avatar" src="...">

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=324725585&siteId=291194637