Summarize the HTML knowledge of this week's learning

HTML: Hypertext Markup Language. Used to define the content structure of a document. (Hyper Text Markup Language).

Hyper text (hypertext): Includes not only text, but also pictures. Connect, music, video and other non-text elements.

Markup Language Markup Language: is a set of tag tags that HTML uses to describe a Web page using tag tags.

HTML comments:<!--Comment--
Comments are used to describe code functions, and the browser parsing code ignores comment content
Shortcut key: Ctrl +? Comment Two, revoke the

HTML Elements (tags, tags):

1. What is an HTML element: An HTML element is an important part of an HTML document, and an HTML document consists of a large number of elements in all the content structures of the HTML. are organized into pages by elements.

Example: H3 is the start tag (element, tag) that represents the beginning of the element's middle space between the element content/h3 is the end tag (tag, tag) that represents the end of the element

Example: <a herf = "path" > Baidu </a>
Tag Attribute Name property value element content end tag
(a marks a connection)

Components of the 2.html element

3. Empty elements: Also called self-closing elements

4. Hierarchy of elements: the content of one element can contain other elements, forming a nested hierarchy. However, 2 elements cannot be nested between them.

Example: <a>

Example:<p><strong></p><strong> wrong

HTML Document Structure:

1. The document declaration is neither an element nor a comment, it always appears in the first line of the HTML code. <! DocTYPE html;: Used to inform the browser that the current document is using that HTML version. Unless the document is declared. When the browser renders the page, it goes into weird mode.

2.html element: Also called the root element, the root tag, which is the ancestor element of all other elements. All other elements in the document must be placed in the element's content.

Related properties: lang
This property may affect your browser's voice reading and translation behavior.

Example:

Example:

3 Head element: Also called the document header, which is the first child element of an HTML element, the document header can contain additional elements that describe additional information about the page.

Litle title: Identifies the document title, which is displayed in the browser's title bar on the Inventory tab.

<meta> empty element, which identifies additional metadata for the page (additional information related to the page), is just an empty element.

Example: <meta charsef= "Utf-8" > refers to the browser, using the character encoding set Utf-8 parsing the page.

The head element contains the following elements:<title><meta><style><link><script>

4.body element: Also called the document body, all the visible content in the page is placed in the element.
It contains a large number of other elements that define the content structure of the document.

Absolute path and relative path:

Referencing CSS:

1. Use an external style sheet: CSS code in a separate file, HTML is introduced to the page via the link element.

Example: <link rel = "stylesheet" Herf = "Import path" >
Link empty element. Represents a reference to an external resource.

2. Using an internal style sheet: write CSS code into the style element content of an HTML document

The use of the internal style sheet features: ① No style sheet file, at some point can improve efficiency;
② multiple pages is difficult to share styles and is not conducive to code reuse.
③html and CSS code mixed, not conducive to programmers and search engine reading.

3. Use inline style sheet: Also called inline, CSS code is written in the element's style property, the inline style does not write the selector.

Features of the inline style sheet: ① does not have a stylesheet file, and at some point it can improve efficiency.

The child elements inside the head are:
Search for metadata and script tags

<meta charset= "Utf-8" >

<title> haha </title>

<style type= "Text/css" >

<link rel = "stylesheet" herf= "path" ></style>

<script> </script>

<noscript> </noscript>

<base herf= ""/> to write the corresponding commands.

Text elements:

<a Herf = "ww.baidu.com" > Baidu </a>

</span> Hello, world! </span> change a piece of text in a long paragraph

<b> Hello, world! </b> Don't use bold
<strong> Chengdu, Hello! </strong> Semantic Bold

Italic <i> </i>
<em> </em> has a focus on the effect, there are semantics, for vision problems

Abbreviation <ABBR title = "Hyper text Markup Language" > HTML </addr> Display is HTML when the mouse just on the HTML full name Hyper Text Markup Lang Uage "is showing up.

Time <time datetime = "2018-2-14" > Valentine's Day </time >
Property value

Fonts <small> </small> It is not recommended to use it only to narrow one number

Sup/sub up and Down tab, x ² show x squared;o₂ show oxygen

Reference: Large segment reference:<blockquote> </blockquote> default indent before it is not a text element, it is a combination of content

Define reference:<cite> </cite> write the appropriate code

<mark> </mark> is a label. The background color is automatically yellow

Combined content:

Line break <br> no use-

Horizontal <p>

The HTML before the area block is used for layout:
<div>

</div>

How to write in precompiled <pre> </pre> code how to display it. Very little to use.

Large segment Reference:<blockquote> </blockquote> indent before default

The SRC attribute indicates that the internal resource is referenced
when the picture cannot be displayed "logo"

The Herf property represents access or fetch of external resources; <link Herf = "" > External style

<a Herf = "" > Jump

Picture description
<figure>

<figcapiton> Crayon Small New </figcapiton>

<figure>

<meta name = "keyword" content= "crayon small new, small white, beautiful carisolv." /> Keywords/keywords
<meta name = "Discription" content= "It is a Japanese anime that tells ..."

List:

Ordered list
<ol>
<li> </li>
<li> </li>
</ol>
Shortcut key Ol>li*n Tab key

Unordered list
<ul>
<li> </li>
<li> </li>
</ul>
Shortcut key Ul>li*n Tab key

Definition List
<dl>
<dt> Front-End engineers </dt>
<dd> need to have </dd>
<dl>

Table elements:

<table border = "2" > Translate 2px border
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>

Shortcut key: tr* number of rows >td* columns

TD Clospan = "Several cells" column that represents a column horizontally merged into a column
TD rowspan = "Several cells" row represents rows vertically merged into rows

* table cell <form action = "#" method= "Get/post"

Input box:

<input type = "Text"/>
<input type = "Password"/>
<input type = "Submit" value= ""/> Submit button, with submit function, the browser can recognize
<input type = "button" value= ""/> Normal button
<input type = "reset"/> reset button
<input type = "number" min= "" max= "" step= "" value= ""/> (max max step spacing/Steps value initial min min)
<input type = "text" Required maxlength= ""/> The length of the required entry box
<input type = "Date"/> Add a daily plug-in
<input type = "COLOR" name = "Color"/> The colors you like

Select down menu (list):
Ctr+d Copy the current line

<select name = "City" id= "" >
<option value = "CD" > Chengdu </option>
<option value = "my" > Mianyang </option>
<option value = "Gy" > Guangyuan </option>
......

</select >

Radio Box:

<input type = "Radio" name= "Aihao" value= "Paobu"/> Run
<input type = "Radio" name= "Aihao" value= "Lvyou"/> Tour
<input type = "Radio" name= "Aihao" value= "Kanshu"/> Reading
<input type = "Radio" name= "Aihao" value= "huahua0"/> Painting

Multiline text box:

<input type = "checkbox" Name= "Aihao" value= "Paobu"/> Run
<input type = "checkbox" Name= "Aihao" value= "Lvyou"/> Tour
<input type = "checkbox" Name= "Aihao" value= "Kanshu"/> Reading

<input type = "checkbox" Name= "Aihao" value= "huahua0"/> Painting

Tips for quick Information selection:
<input type = "text" list = "City"
<datalist id = "City" >
<option value = "CD" > Chengdu </option>
<option value = "SN" > Suining </option>
.........
</datalist>

Semantic elements of the structure:

Header used to represent a page or an area header

Nav used to represent the navigation bar

Aside used to indicate the surrounding topics related to Hu additional information

Article used to represent articles or other independent pages of Hu content

section is used to represent a whole part of the theme of Hu

Footer used to represent a page or an area Hu footnotes

Embedded element:

Audio/Video elements:

<audio src = "path" controls AutoPlay loop></audio> audio playback
<video src = "path" controls AutoPlay loop> </video> audio playback

Controls are properties and values are controls, so write a controls here.
AutoPlay Auto Play, no point to start
Loop Loop Playback

Interactive elements:
<datails>
<summary>
</summary>
<p>
</p>
</datails>

Summarize the HTML knowledge of this week's learning