HTML basic structure_Powernode Java Academy
|
Many times when learning web page development, the first thing that impresses us is the web page ending with html or htm suffix. We classify this type of web page as a static web page, except for pseudo-static ones. So what is the difference between html or htm and other web pages ending with suffixes such as php, asp, aspx, jsp, etc.? First of all, HTML pages are static. There is no program execution from beginning to end. They are pure HTML language. They are sent directly to the browser and presented to the viewer without being processed by the server. So what is the basic language structure of HTML? Let's take a look at the HTML structure first: <html> <head> <title>Place the article title</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> //This is the web page encoding, now it is gb2312 <meta name="keywords" content="Keywords" /> <meta name="description" content="Description of this page or keyword description" /> </head> <body> This is the main content</body> </html> Complete HTML includes html DOCTYPE declaration, title, head, web page coding declaration, etc. Initially with full html source code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 0 Transitional//EN" "http://wwwworg/TR/xhtml1/DTD/xhtml1-transitionaldtd"> <html xmlns="http://wwwworg/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Title part - power node</title> <meta name="keywords" content="Keywords" /> <meta name="description" content="Description of this page or keyword description" /> </head> <body> Contents</body> </html> The latest complete HTML structure-HTML source code (recommended): <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Webpage title</title> <meta name="keywords" content="Keywords" /> <meta name="description" content="Description of this page" /> </head> <body> Web page content</body> </html> Whether it is html or a dynamic page with other suffixes, the html language structure is the same, but it ends with a different suffix when naming the web page file. 1. Whether it is a dynamic or static page, it starts with "<html>" and ends with "</html>" at the end of the web page. 2. After "<html>" comes the page header "<head>". The content in <head></head> cannot be displayed in the browser. This is the area for the server, browser, link external JS, a link CSS style, etc., and the web page title is placed in "<title></title>". 3. Then the contents of these two tags “<meta name="keywords" content="Keywords" /> <meta name="description" content="Description of this page or keyword description" />” are for search engines to see the keywords of this page and the main content of this webpage, etc., which can be used by SEO. 4. Next is the main text "<body></body>", which is often called the body area. The content placed here can be presented to users through the browser. The content can be in table layout format, DIV layout format, or directly text. This is also the most important area, the content presentation area of the web page. 5. It ends with “</html>”, which means the web page is closed. The above is a complete and simplest basic structure of HTML language. Through the above, you can add more styles and content to enrich the web page. The above is the simplest HTML language structure in layman's terms. If you need to see more rich HTML language structures, you can open a website's web page, then click "View" on the browser - then click "View Source Code" to see the HTML language structure of the web page. In this way, you can analyze the HTML language structure and content of this web page based on the source code. |
<<: Common considerations for building a Hadoop 3.2.0 cluster
>>: Some wonderful uses of URL objects in JavaScript
Recommend
How to set focus on HTML elements
Copy code The code is as follows: <body <fo...
Pure CSS to achieve cloudy weather icon effect
Effect The effect is as follows Implementation ...
The latest mysql-5.7.21 installation and configuration method
1. Unzip the downloaded MySQL compressed package ...
Detailed explanation of webpack-dev-server core concepts and cases
webpack-dev-server core concepts Webpack's Co...
MySQL Index Optimization Explained
In daily work, we sometimes run slow queries to r...
Detailed explanation of the use of CSS pointer-events attribute
In front-end development, we are in direct contac...
Vue + element to dynamically display background data to options
need: Implement dynamic display of option values ...
Understanding JavaScript prototype chain
Table of contents 1. Understanding the Equality R...
Understand the initial use of redux in react in one article
Redux is a data state management plug-in. When us...
Linux Network System Introduction
Table of contents Network Information Modify the ...
How to avoid duplication of data when inserting in MySql batch
Table of contents Preface 1. insert ignore into 2...
Detailed explanation of using backgroundImage to solve the image carousel switching
Implementing carousel with a single DOM node You ...
Summary of common Mysql DDL operations
Library Management Create a library create databa...
How to call the interrupted system in Linux
Preface Slow system calls refer to system calls t...
Vue Element front-end application development dynamic menu and routing association processing
Table of contents Overview 1. Menu and routing pr...