Simple content of H4 and C2

It has been a long time since the beginning of contact with the front end, and only for the individual to write points for H4 and C2 knowledge points.

1.font

This is one of the more important attributes in HTML,

Usage: <font color= "Gray" size= "2" face= "song body" > Content </font>

Color: Make text color change

Size: Range is 1-7 normal 3

Face: Specifies the font of the text

Font-weight setting the specific number range is 100-900.

Font's ligatures:

Font:font-style font-weight font-size font-family;

Characteristics:

Font-style,font-weight can be omitted

Font-style,font-weight can be exchanged in order

Font-size font-family can not be omitted

For example: font:15px "Chinese Xingkai";

Where the font size and font system is required to write

line-height:40px;

The row height definition needs to be after the font definition, and if the row height is before the font, Line-height expires!

2. Bold, italic, underline, strikethrough

Label	Usage	Effect	The same effect that was discarded
Strong	<strong></strong>	Bold	B
Em	<em></em>	Italic body	I
Ins	<ins></ins>	Underline	U
Del	<del></del>	Delete Line	S

3.OL,UL,DL List

UL unordered list:

<ul>

<li> content </li>

<li> content </li>

</ul>

OL ordered List

DL Custom list:

<dl>

<dt> Small title </dt>

<dd> content </dd>

</dl>

Among them, the UL list in the future development will be used frequently

4.table table

<table>

<caption> title </caption>

<thead><tr><th> Table Header </th></tr></thead>

<tbody><tr><td> content </td></tr></tbody>

<tfoot><tr><td> End of the table </td></tr></tfoot>

</table>

Colspan= "2" rowspan

Personally think the form to understand, can understand, because there is not too much need to use this type of form

5. Hyperlink tags

Target= "How to Jump"

_blank Open the page in a new window

_self Jump on current page

Use a tag to position labels on a page

To prepare a label that is positioned by a label, you must have the id attribute

The value of the href attribute of the label is the ID of the #+ target label

Implementing the Download function

<a href= "relative path to Files" ></a>

Attention:

① This approach is rarely used in the present

② If the browser recognizes this file, it will open in the browser directly

6.input input Box

<input type= "text" placeholder= "Please enter user name" value= "123456"/>

Properties: Placeholder hint of text, when we enter the content, will disappear

MaxLength setting the maximum allowable input length

<form action= "" >

<fieldset>//Add a box to the form

<legend> Test the Type attribute//word on the box

</legend>

<label for= "" >color:

</label>

<label for= "" >tel:

</label>

<input type= "Tel" >

<input type= "Submit" >

</fieldset>

</form>

This property is also a particularly important property, because in the Web page we can click to enter the content of the text box, 80% is the input tag

7. Positioning

1. Fixed positioning

Position:fixed

Characteristics:

1 does not occupy the original position in the standard flow

2 Mode Conversion

3 benchmark for positioning is browser-based

2. Absolute positioning

Position:absolute

Characteristics:

1 does not occupy the original position in the standard flow

2 but the transformation of the implementation mode

3 If the parent element is set to be positioned, absolute positioning is relative to the parent element, otherwise it is relative to the browser

3. Relative positioning

Position:relative

Characteristics:

1 occupy the original position in the standard flow

2 cannot implement a schema conversion

3 positioning is relative to the original position in the standard flow

4. Static positioning

Position:static

Static positioning is actually the standard flow, is also the default situation

Characteristics:

1 occupy the original position

2 cannot implement a schema conversion

3 positioning no matter how it is set, it has no effect

Usually in use, to remember the child absolute father, that is, to the child element absolutely positioning, then to the parent element relative positioning, so that the child element relative to the parent element to set the location of the positioning

8. Hierarchy

Z-index:number

The default level is 0 and the maximum is 9999, and of course this is rarely done to set the hierarchy.

Only elements that have been positioned are able to use this property, and static positioning is not possible with the Z-index

Control the level in the locator.

Writing is not very good, the specific content I think it is more practical to explore

Simple content of H4 and C2