11.49. HTML5 code specification

发布时间 ： 2025-10-25 13:33:11 UTC      

Page Views: 9 views

11.49.1. HTML code convention

Many Web developers know very little about HTML’s code specifications.

Between 2000 and 2010, many Web developers switched from HTML to XHTML.

Developers using XHTML have gradually developed better HTML writing specifications.

For HTML5, we should form a better code specification, and here are several suggestions for the specification.

11.49.2. Use the correct document type

The document type declaration is on the first line of the HTML document:

If you want to use lowercase like other tags, you can use the following code:

11.49.3. Use lowercase element names

HTML5 element names can be in uppercase and lowercase letters.

Lowercase letters are recommended:

  • The mixed case style is very bad.

  • Developers usually use lowercase (similar to XHTML).

  • The lowercase style looks more refreshing.

  • Lowercase letters are easy to write.

Not recommended: 

<SECTION> <p>This is a paragraph.p> SECTION>     
 
 Very bad:  
 
 
 
<Section> <p>This is a paragraph.p> SECTION>     
 
 Recommended:  
 
 
 
<section> <p>This is a paragraph.p> section>      
 
  11.49.4.  Close all HTML elements  
 
 In HTML5, you don’t have to close all elements (for example, < p > elements), but we recommend that each element add a close tag. 
 
 Not recommended: 
 
 
 
<section> <p>This is a paragraph. <p>This is a paragraph. section>    
 Recommended: 
 
 
 
<section> <p>This is a paragraph.p> <p>This is a paragraph.p> section>     
 
  11.49.5.  Turn off empty HTML elements  
 
 In HTML5, empty HTML elements do not have to be closed: 
 
 We can write like this: 
 
 
 
<meta charset="utf-8"> 
 
 
 
 It can also be written like this: 
 
 
 
<meta charset="utf-8" /> 
 
 
 
 A slash (/) is required in XHTML and XML. 
 
 If you expect XML software to use your page, using this style is very good. 
 
 
 
  11.49.6.  Use lowercase property names  
 
 HTML5 property names allow uppercase and lowercase letters. 
 
 We recommend using lowercase property names: 
 
     
  •  
     It is a very bad habit to use both uppercase and lowercase. 
     
    •  
  •  
     Developers usually use lowercase (similar to XHTML). 
     
    •  
  •  
     The lowercase style looks more refreshing. 
     
    •  
  •  
     Lowercase letters are easy to write. 
     
    •  
 
 Not recommended: 
 
 
 
<div CLASS="menu"> 
 
 
 
 Recommended: 
 
 
 
<div class="menu"> 
 
 
 
 
 
  11.49.7.  Attribute value  
 
   HTML5   Property values can be without quotation marks. 
 
 We recommend using quotation marks for attribute values: 
 
     
  •  
     Use quotation marks if the attribute value contains spaces. 
     
    •  
  •  
     Mixed style is not recommended, it is recommended to unify the style. 
     
    •  
  •  
     Property values are easy to read using quotation marks. 
     
    •  
 
 The following instance property values contain spaces and do not use quotation marks, so they do not work: 
 
 
 
<table class=table striped> 
 
 
 
 The following double quotation marks are correct: 
 
 
 
<table class="table striped"> 
 
 
 
 
 
  11.49.8.  Picture Properti  
 
 Pictures are usually used   alt   Property. When the picture cannot be displayed, it can replace the picture display. 
 
 
 
<imgsrc="html5.gif"alt="HTML5"> 
 
 
 
 Define the size of the picture, you can reserve the specified space when loading to reduce flicker. 
 
 
 
<img src="html5.gif" alt="HTML5" style= **"width:128px;height:128px**"> 
 
 
 
 
 
  11.49.9.  Spaces and equal signs  
 
 Spaces can be used before and after the equal sign. 
 
 
 
<link rel ="stylesheet" href ="styles.css"> 
 
 
 
 But we recommend using fewer spaces: 
 
 
 
<link rel="stylesheet" href="styles.css"> 
 
 
 
 
 
  11.49.10.  Avoid too long a line of code  
 
 With the HTML editor, it is not convenient to scroll the code around. 
 
 Try to have less than 80 characters per line of code. 
 
 
 
  11.49.11.  Blank lines and indents  
 
 Don’t add blank lines for no reason. 
 
 Add blank lines to each logical block to make it easier to read. 
 
 Indentation uses two spaces, and TAB is not recommended. 
 
 Do not use unnecessary blank lines and indents between shorter code. 
 
 
 Unnecessary blank lines and indents:  
 
 
 
<body> <h1>菜鸟教程h1> <h2>HTMLh2> <p> The rookie tutorial not only teaches skills, but also dreams. The rookie tutorial not only teaches skills, but also dreams. The rookie tutorial not only teaches skills, but also dreams. The rookie tutorial not only teaches skills, but also dreams. p> body>     
 
 Recommended:  
 
 
 
<body> <h1>rookie tutorialh1> <h2>h2> <p>The rookie tutorial not only teaches skills, but also dreams. The rookie tutorial not only teaches skills, but also dreams. The rookie tutorial not only teaches skills, but also dreams. The rookie tutorial not only teaches skills, but also dreams.p> body>     
 
 Table example:  
 
 
 
<table> <tr> <th>Nameth> <th>Descriptionth> tr> <tr> <td>Atd> <td>Description of Atd> tr> <tr> <td>Btd> <td>Description of Btd> tr> table>     
 
 List example:  
 
 
 
<ol> <li>Londonli> <li>Parisli> <li>Tokyoli> ol>      
 
  11.49.12.  Omit < html > and < body >?  
 
 In standard HTML5      and      tags can be omitted. 
 
 The following HTML5 documents are correct: 
 
 
 Example:  
 
 
 
  TITLE  
This is a title
 
This is a paragraph.
 
 
 
 
 Omission is not recommended      and      label. 
 
      Element is the root element of the document and is used to describe the language of the page: 
 
 
 
  
 
 
 
 The declaration language is designed to facilitate screen readers and search engines. 
 
 Omit      or      crashes in DOM and XML software. 
 
 Omit      errors occur in older browsers (IE9). 
 
 
  
 
  11.49.14.  Meta data  
 
 In HTML5    </span> </code> the element is required, and the title name describes the theme of the page: </p> <div class="highlight-default notranslate"> <div class="highlight"> <pre><span></span><span class="o"><</span><span class="n">title</span><span class="o">></span><span class="n">Rookie</span> <span class="n">Tutorial</span><span class="o"></</span><span class="n">title</span><span class="o">></span> </pre> </div> </div> <p> Title and language allow search engines to quickly understand the theme of your page: </p> <div class="highlight-default notranslate"> <div class="highlight"> <pre><span></span><!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>Rookie Tutorial      
 
  11.49.15.  HTML comment  
 
 Comments can be written in : 
 
 
 
 
 
 
 
 Longer comments can be written on lines : 
 
 
 
 
 
 
 
 The first character of a long comment is indented by two spaces, making it easier to read. 
 
 
 
  11.49.16.  Style sheet  
 
 Stylesheets use a concise syntax format (the type attribute is not required): 
 
 
 
<link rel="stylesheet" href="styles.css"> 
 
 
 
 Short rules can be written on one line: 
 
 
 
p.into{font-family:Verdana; font-size:16em;} 
 
 
 
 Long rules can be written in multiple lines: 
 
 
 
body{ background-color:lightgrey; font-family:"Arial Black", Helvetica, sans-serif; font-size:16em; color:black; } 
 
 
 
     
  •  
     Place the left curly braces on the same line as the selector. 
     
    •  
  •  
     Add a space between the left curly bracket and the selector. 
     
    •  
  •  
     Use two spaces to indent. 
     
    •  
  •  
     Add a space between the colon and the attribute value. 
     
    •  
  •  
     Use a space after commas and symbols. 
     
    •  
  •  
     Each attribute and value ends with a semicolon. 
     
    •  
  •  
     Quotation marks are used only if the property value contains spaces. 
     
    •  
  •  
     The right curly braces are placed on the new line. 
     
    •  
  •  
     A maximum of 80 characters per line. 
     
    •  
 
 Image0 
 
 It is a common rule to add spaces after commas and colons. 
 
 
 
  11.49.17.  Load JavaScript in HTML  
 
 Use concise syntax to load external script files   type   property is not required): 
 
 
 
<script src="myscript.js"> 
 
 
 
 
 
  11.49.18.  Access HTML elements using JavaScript  
 
 A poor HTML format can cause JavaScript execution errors. 
 
 The following two JavaScript statements output different results: 
 
 
 Example  
 
 
 
var obj = getElementById("Demo") var obj = getElementById("demo") 
 
 
 
 Try to use the same naming convention for JavaScript in HTML. 
 
 
 
 
  11.49.19.  Use lowercase file names  
 
 Most Web servers (Apache, Unix) are case-sensitive:   london.jpg   can’t pass   London.jpg   to visit. 
 
 Other Web servers (Microsoft, IIS) are case-insensitive:   london.jpg   can be passed through   London.jpg   or   london.jpg   to visit. 
 
 You must maintain a uniform style, and we recommend using lowercase file names. 
 
 
 
  11.49.20.  File extension  
 
 The HTML file suffix can be   .html   (or   .htm   ). 
 
 The CSS file suffix is   .css   . 
 
 The JavaScript file suffix is   .js   . 
 
 
 
  11.49.21.    .htm   and   .html   the difference between  
 
   .htm   and   .html   there is essentially no difference in the extension file of Both browsers and Web servers treat them as HTML files. 
 
 The difference is: 
 
   .htm   when used in early DOS systems, the system may now have only three characters. 
 
 There are no special restrictions on suffixes in Unix systems.   .html   . 
 
 
 
  11.49.22.  Technical difference  
 
 If a URL does not specify a file name (such as  http://www.runoob.com/css/  ）the server will return the default file name. The default file name is usually   index.html   ,   index.htm   ,   default.html   ,   default.htm   . 
 
 If the server is configured with only “index.html” as the default file, you must name the file “index.html” instead of “index.htm”. 
 
 However, usually the server can set multiple default files, and you can set the default file name as needed. 
 
 Anyway, the full suffix of HTML is “.html”. 
 
  
                
                

                    

                        

                            
                                文章链接
                            
                            ：
                            11.49. HTML5 code specification 
                        

                    

                

            
        
        

            

    
        
        

            

                

                    
                        
                            
                                Web框架 
                            
                            
                        
                             946
                        
                    
                    
                    
                        

                            
 
 
 

                        

                    
                

                
                

            

        
    
    
        
        

            

                

                    
                        
                            
                                《地理信息系统原理、技术与方法》 
                            
                            
                        
                             97
                        
                    
                    
                    
                        

                            
 
 
 最近几年来，地理信息系统无论是在理论上还是应用上都处在一个飞速发展的阶段。 GIS被应用于多个领域的建模和决策支持，如城市管理、区划、环境整治等等，地理信息成为信息时代重要的组成部分之一； “数字地球”概念的提出，更进一步推动了作为其技术支撑的GIS的发展。 与此同时，一些学者致力于相关的理论研究，如空间感知、空间数据误差、空间关系的形式化等等。 这恰好说明了地理信息系统作为应用技术和学科的两个方面，并且这两个方面构成了相互促进的发展过程。 
 
 

                        

                    
                

                
                

            

        
    
    
        
        

            

                

                    
                        
                            
                                WEB基础 
                            
                            
                        
                             289