The basic use of html includes links, style sheets, span and div, etc.

1. Links
Hypertext links are very important in HTML. The basic format is as follows:

<A HREF="Resource Address">Link Text</A>

1. Local link ① Absolute path:
<A HREF="C:\images\article.jpg">Absolute path link to local image</A>
②Relative road strength
<A HREF ="article2.jpg"> Relative path link to local image</A>
③Link to the previous directory

<A HREF="../test.htm">Link to the previous directory</A>

2. URL link format: protocol name://host.domain name/path/file name The protocol includes:
file local system file
http www server
ftp ftp server
telnet is based on TELNET protocol
mailto email
news Usenet newsgroups
gopher GOPHER server
wais WAIS server

For example: <A HREF="http://www.baidu.com"> Baidu search</A>

3. Directory link First set a paragraph as the link location, the format is:
<A NAME="Link location name"></A>
Then call the file of this link part and define the link:
<A HREF="Filename#Link Location Name">Link Text</A>
Of course, if you jump within a file, the file name can be omitted.

2. Multi-window FRAMES
HTML files designed using the FRAMES structure can divide the entire window into several independent small windows. Each small window can load different files separately and can communicate with each other.
1. Basic structure:
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<FRAMESET>
<FRAME SRC="url">
<FRAME SRC="url">
...
</FRAMESET>
</HTML>
2. Size setting of each window We divide the window into several pieces, using the ROWS attribute horizontally and the COLS attribute vertically. The size of each piece can be realized by the values of these two attributes.
<frameset cols=#>
<frameset rows=#>
The value of # is a pair of strings enclosed in quotation marks. The numbers in the string represent the size of each window, separated by commas. The numbers can also be replaced by "*", indicating that the browser automatically allocates the size. like
<frameset cols="100,200,300">
<frameset rows="10%,20%,70%">
<frameset cols="100,*,*"> Evenly distribute the windows outside 100 pixels
3. Interoperation between windows ①The src attribute of frame is used to specify the content to be linked, the name attribute specifies the name of the window, and the target attribute is used to specify in which window the linked file appears. Its value can be the name defined by name, or one of the following four values:
<a href=url target=_blank> displays a new window
<a href=url target=_self> Display in the same window
<a href=url target=_parent> Displays the window of the previous document in the Frameset
<a href=url target=_top> Displayed in the entire browser window②Other attributes of frame
<frame frameborder=#> #=yes,no
frameborder specifies the settings of each window border: yes means there is a border, no means no border

<frame marginwidth=# marginheight=#>
The value of # is in pixels. This attribute is used to set the width of the top, bottom, left, and right borders of the window. If not set, it will be automatically determined by the browser.

<frame scrolling=#>#=yes,no,auto
Scroll bar settings, yes means yes, no means no, auto means it is set automatically by the browser, the default value is auto.

<frame noresize="noresize">
The noresize attribute specifies that the frame cannot be resized by the user. By default, you can resize a frame by dragging the "walls" between the frames, but this property locks the size of the frame.

3. Style Sheet
1. The most important function of a style sheet is to provide a way to keep the style of all web pages consistent.
The three levels of style sheets are, in order from low to high, as follows:
①. Inline style sheet: Applicable to the content of a single element ②. Document level style sheet: Applicable to the body of the entire document ③. External style sheet: Can be applied to the body of multiple documents. When in use, if there is a conflict, the lower-level style sheet has priority.
2. Issues to note when using CSS:
①Some browsers may not support certain attribute values. In this case, the browser either ignores these attribute values or replaces them with an optional value.
② Built-in styles are only applicable to a single element, which actually goes against the original design intention of the style sheet, so they should be used with caution.
③The document-level style description appears in the header of the document and applies to the entire body of the document. So this is how we can keep the overall style of website construction consistent.
④ External style sheets are not part of the document that uses them. External style sheets need to be stored separately and must be described when they are used. External style sheets can be written as text files using the MIME type text/css. They can be stored in any computer on the Internet, and the browser can obtain external style sheets just like obtaining documents. The <link> element at the top of a web page can also be used to specify an external style sheet. In <link>, the rel attribute is used to specify the relationship between the linked document and the document containing the link, while the href attribute is used to specify the URL address of the style sheet document. like
<link rel=stylesheet type="text/css" href="themes/AutoTheme/style.css"></link>

4. span and div
In some cases, <span> requires that certain special font properties be applied only to part of the text in the entire paragraph, such as setting a word or phrase to a different font or background, etc. This is where you can use the <span> element, for example:
<p>I really enjoy <span style="font-size:24pt;font-family:黑体;color:red">programming</span>, it is a very enjoyable thing. </p>

The use of <div> is very common in web pages. Sections are composed of several paragraphs. If you want to set the style not only for each paragraph, but also for the sections in the web page during design. At this time, you can use <div>, its main purpose is to specify the appearance display details of a section or area in a web page.

<<: Detailed process of installing various software in Docker under Windows

>>: MySQL8.0.18 configuration of multiple masters and one slave