Article Directory
The web system is presented in the form of a website, while the front end is presented in the form of a web page.
Websites and Pages
- Web site : A collection of related web pages on the Internet that present specific content. That is to say, a website contains multiple web pages, and a website is a collection of web pages.
- Web page (web page): A page in a website, and web pages in a website are organized together by means of "hyperlinks".
It can be compared to a website as a book and a web page as a page.
- Homepage (homepage): The first webpage you see when you enter the website. The file name of the homepage is usually index.
The English translation of index is:
n. index; (price and wages, etc.) index; indicator, measurement; power, root index; pointer
- Web page elements
Site logo (Logo), navigation bar, text hyperlinks, advertising banners, forms, etc.
Essentially, websites are folders, and web pages are the files inside.
We put the completed website on the server side , and users use their own devices (called clients ) through browsers to access the web pages in the website folder provided by the server side.
For example, when a client requests to visit Baidu's homepage through the client, the server receives the request, finds the corresponding page, and returns it to the client, so that the client can use this page.
The role of the browser
Web pages are essentially files, and the browser can parse the code in the file, parse the source code, and render the web page.
The browser is like a translator, translating files written in code into pages so that we can see the content.
Some major browsers:
And my favorite Edge browser
(Supports many plug-ins, many functions, friendly pages, beautiful appearance, simply yyds)
HTML
~~ (Hyper Text MarkUp Language)
Hypertext Markup Language is a standard language for making web pages.
Label
Surrounded by angle brackets <p> , usually in pairs. like
<p> ... </p>
the first one isstart tag, the second one isend tag.
Between these two labels is the specific content. These 3 together form elements in html.
Tags can also appear by themselves, eg <img /> , such a tag ends with a trailing slash.
- Tag nesting: If you want to nest other tags inside a pair of tags, you need to nest the start and end tags of other tags in it. This is a complete nesting. It is not possible to nest only one of them.
For example:<html> <body></body> </html>This is the correct way to write. - Label indentation: When a pair of labels nests another pair of labels, as in the previous example, the html label is called the outer label, and the body label is the inner label. We can use indentation to distinguish the outer label when writing. Layer tags and inner layer tags.
- After such indentation, we call the outer layer the parent
<html> ... </html>element , the inner layer and the child element , and because head and body are at the same level, we call them sibling elements .<head> ... </head><body>...</body> - Tag attributes: Tags can have multiple attributes, and the order of their attributes is irrelevant.
The src attribute is the address of the image
and the alt attribute is the text to be replaced when the image cannot be displayed.
element
element： ~~ element = start tag + content + end tag
note
note： ~~~ The comment statement format of html is<!--这句话是注释-->
The structure of the html file：
When writing a web page file in html, you need to change the suffix of the file to .htm or .html .
(The code in the picture is not typed by hand, as long as the .html file is created, enter an exclamation mark (English) ! in the first line of the editor, and press Enter to automatically display these)
<html> ... </html> Tags are the beginning and end of the entire file. The content in these two tags is regulated by the grammatical format of html.
<head> ... </head> The tag represents the header information of the file, which is some information provided by the web page for browsers and search engines. For example, <title>冬至</title> the content of the label is displayed in the title bar of the page.
<body> ... </body> Indicates the main content of the web page, that is, the content displayed when the page is opened.
Garbled problem
Garbled characters appear when opening the web page：
The essential reason is because one encoding is used to encode but another encoding is used to parse the file content.
When the encoding when the source file is saved <meta charset="编码方式"> is inconsistent with the source file declaration, garbled characters will appear.