Home>Article>Web Front-end> Detailed introduction to HTML tags, selectors, hyperlinks and SEO
Common tags:
The img tag is a single tag alt function. The image fails to load and displays the content in the alt
< img src="Picture name" alt="Picture name"/>
Detailed introduction of a tag:
Link implementation of a tag:
a tagClicking the a tag
will go to the corresponding link to control the link to open a new page or other target, as well as self and other
him;
Write
, if there are some people in the body section For the target attribute, the target attribute in the a tag in the body part is
first;
The download implementation of the a tag:Put in the things to be downloadedUse
# inside to implement the download function
The anchor point implementation of the a tag:(a Anchor) Baibu Fei
The title tag is not one but a group of six:
Paragraph tag Use p tag for a paragraph
< ;p/>
Emphasis tag strong The page is displayed in bold by default
Content (Content)
Also The effect of emphasis is not as important as the tone of the strong tag. The default display is italic
span tag
distinguishes styles, a paragraph of text or content style distinguishes
Conten
List
Ordered List
No list required
Definition list
SEO: Search engine optimization For example: Baidu wait
Function: There is a crawler program that searches for information every day and saves it.
Advantages of tags:
Semantic page tags;
Using tags that are beneficial to SEO; h1; h2; h3;strong;em accounts for about 7% or 8%. Reasonable optimization
Do not overuse
Increase page keyword density;
id selector
#box1,box2{
width:100px;height:100px;background:red;
}
Group selector # followed by id+","+ A group of id uses the same style
.box(id) and the use of class class is a class, which can be understood as an id that can be used repeatedly
;
class selector can be followed by multiple styles
Type selector tag name {}
Inclusion selector: Select according to the inclusion relationship in the page
div p{ } represents all p tags in the div tag
Wildcard character
*{border:1px solid red;} All in the page have this format and are basically useless
Selector Priority:
Prerequisites at the same level: The style defaults to the latter overriding the former
The higher the inclusion level, the style will use which
class style selector
The order of calling names at the same level does not matter, only the order of styles
Type (1)
(javaScrapt)
Compare style priorities and judge based on the number of highest style priorities
Do not write too deep inclusion relationships during work
Pseudo-class of a:
link not visited
hover mouse hover (mouse across)
active link activation
visited after visit
Written in style
a：link{}
a:hover{}
Pseudo class sequence link visited hover active
Application: Search engine novels, etc.
div pseudo-class: hover Most tags support hover
IE6 does not support a pseudo-class of any other tags
Supported by IE6 and above
The above is the detailed content of Detailed introduction to HTML tags, selectors, hyperlinks and SEO. For more information, please follow other related articles on the PHP Chinese website!