Shulou(Shulou.com)06/01 Report--

This article mainly shows you "what is the basis of Web development HTML", the content is easy to understand, clear, hope to help you solve your doubts, the following let the editor lead you to study and learn "what is the HTML of Web development foundation" this article.

HTML provides content (structure and content) on the page

CSS beautifies the web page (style)

JavaScript controls (controls) the content on a web page.

Common development tools:

Lightweight text type: VSCode, Sublime

Weight IDE: WebStrom

What is HTML?

HTML (English abbreviation for Hyper Text Markup Language) is translated into Hypertext markup language in Chinese.

Describe the text, pictures, sounds and other content in the web page through HTML tags.

Open a page on the network and view the source code through the browser debugging tool

Format of HTML

Basic format

Html tags: the root node of all html tags

Head tag: describes some information on a web page that is not displayed and rendered.

Title tags: the title of a web page

Body tag: the theme section of the page, which mainly writes the content of development.

Tip: quickly create the page structure of html through an editor

After creating a new html file in vscode, enter! Press the tab key to quickly generate a HTML5 standard page structure.

Double label

Grammatical format

At the front of the entire tag, it is called the "start tag".

At the end of the entire tag, it is called the closing tag (end tag)

The end tag is just more than the start tag, with an extra closing character "/" in front of it.

Single label

Grammatical format

For example

UTF-8 is the most commonly used character set encoding method at present, and the commonly used character set coding methods are gbk and gb2312.

GB2312 simple Chinese includes 6763 Chinese characters

BIG5 traditional Chinese, Hong Kong, Macao, Taiwan, etc.

GBK contains all Chinese characters is an extension of GB2312, adding support for traditional characters, compatible with GB2312

UTF-8 contains characters that all countries in the world need to use.

Tip: in the future, we can uniformly use the UTF-8 character set to avoid garbled codes caused by inconsistent character sets.

Title label

Grammar.

The title tag ranges from large to small according to the size of 1-6. As shown in the figure below, 1-6 title tags are provided by default. If you write H7, it is ordinary text.

Paragraph label

Abbreviation: paragraph paragraph

Using paragraph tags, you can make the text in a web page appear in a paragraph format.

Syntax:

Horizontal line label

Newline label

Acronym: break interrupts, line breaks in HTML, the default line breaks need to be at the right end of the browser window to automatically wrap, so the effect is not consistent in each device. If you need to force line wrapping of a paragraph of text, you need to use a newline tag.

Syntax:

Exercise: implement a simple news page

Div span tag

Div division is abbreviated to partition, which means that there are actually a lot of div to combine web pages. Block level element

Span span, span; range, inline element

Grammar.

Tag attribute

When using HTML to make a web page, if you want the tag to provide more information, you can use some properties of the tag to set it.

Grammar.

Example

Width property, with a value of 200 to control the width

The align property, with a value of left that controls how it is aligned horizontally

The default hr tag occupies the entire line. After setting the above attributes, the width is only 200 of the set width.

The default hr is centered and left aligned.

Picture label

Word abbreviation: image image (single label)

Grammar.

Set the path and file name of the image file through the src property. Is a required attribute of the img tag.

Picture tag attribute

Src can be a network path, a local absolute path or a relative path, provided that the path exists and the picture is valid, otherwise use the set text instead

Link label

Abbreviation: anchor anchor

Grammar.

Exampl

Jump directly overwrites the current page jump by default, and add target= "_ blank" to open a new page jump.

Jump requires adding a protocol such as http, otherwise it will add a jump link to the absolute path of the current directory.

Special character label

Some tags in html, with special meaning, will be parsed by the browser directly. If you need to output these tags, you need to use escape and alternative syntax.

For example, you need to display on the page:

Tags are often used for paragraphs and are written directly in html text.

Parsed as a tag, the page will not be displayed

Need to be written in the following format

Comment label

Comment tag, you can add some easy-to-read and understandable text to the HTML document, and the content of this tag is not directly displayed, but can only be seen through the source code.

Grammar.

You can also directly select the statement ctrl+/ comments that need comments.

List label

Grammar.

① can only nest tags in tags. Direct nesting of other tags is syntactically not allowed.

The ② tag serves as a container that can hold other tag elements.

③ unordered lists have default styles that can be decorated with CSS.

Page display

Ol ordered label

Precede with a serial number

Page display

Form label

Grammar.

Table Properti

① can use the th tag to set the header, that is, change td to th, and the header can be set to header mode and bold.

After ②, you can use CSS to decorate the style of the table

Example:

A list of hosts

Page display

Modify settin

Display effect

Form

In HTML, the form tag is used to define a form. Used to achieve the collection and transmission of user-related information, and interact with the back end. Everything in the form is submitted to the server.

Syntax:

Common attributes:

The action value is the URL address submitted to the backend to receive

Method sets the submission method of the form to get or post

Form control composition

In the form provides a variety of form space, single-line text input box, password input box, check box, submit button, reset button, and so on.

Input control

The input control is the most commonly used in the form and needs to be mastered. The basic tag attribute is the type attribute

Used to define different control types.

Other common properties

Textarea control (text field)

When you need to enter a lot of information, you can use the textarea tag. An input box that implements multiple lines of text.

The above is all the content of the article "what is the HTML of Web Development Foundation". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.