<A> label pseudo-class style
A set of specialized pre-defined classes are called pseudo classes, which are mainly used to process the hyperlink status. The hyperlink text status can be controlled by pseudo-class selector + style rules. Pseudo-class delimiters include:
Total: A indicates connections in all states, such as a {color: Red}
① A: Link: unaccessed link, for example, a: link {color: Blue}
② A: visited: The accessed link, for example, a: visited {color: Blue}
③ A: active: the link color when the link gets the focus, for example, a: Active {color: Blue}
④ A: hover: When you move the mouse over the link, for example, a: hover {color: Blue}
Generally, the status of a: hover and A: visited links (color, underline, etc.) should be the same.
The first three attributes correspond to the link, vlink, and alink attributes of the Body element.
The procedure of the four States is as follows: A: Link-> A: hover-> A: Active-> A: visited. In addition, a: Active cannot be set with or without underscores (always ).
Example: common status values of pseudo classes
[HTML]View plaincopy
- <Style type = "text/CSS">
- <! --
- A {font-size: 16px}
- A: link {color: Blue; text-Decoration: none;} // unaccessed: blue, underline-free
- A: active: {color: red;} // activation: red
- A: visited {color: Purple; text-Decoration: none;} // accessed: Purple, no underline
- A: hover {color: red; text-Decoration: underline;} // move the cursor near: red or underline
- -->
- </Style>
How to remove the underline of <A>:
Use the code "text-decoration" to set the hyperlink underline"
Syntax:
Text-Decoration: None | underline | blink | overline | Line-through
Text-decoration parameters:
None: No Decoration
Blink: flashing
Underline: underline
Line-through
Overline: dashes
To remove the underline, set text-decoration to none.
For example, <style> A {text-Decoration: None} </style>
Can be used on this basis: for example: <style>. myclass A {text-Decoration: None} </style>
<Style> Div A {text-Decoration: None} </style>
Can be extended to the label pseudo class:
A: link {text-Decoration: none; cursor: pointer; color: red ;}
A: visited {text-Decoration: overline; cursor: pointer}
A: active {text-Decoration: overline; cursor: pointer}
A: hover {text-Decoration: overline; cursor: pointer}
. Myclass: hover {text-Decoration: overline; cursor: pointer}
<A> some attributes of a tag
The a tag appears in pairs, starting with <A>, </a>.
Attribute.
Common -- General Attributes
Accesskey -- represents the access method of a link's shortcut key
Charset -- specifies the encoding method used by the page to which the link is linked, such as the UTF-8
Coords-this attribute can be used to define the linked area when using an image map, usually using X and Y coordinates.
Href -- represents a link source (that is, the link location)
Hreflang-indicates the language code used to link to the page
Rel indicates the relationship between the document and the linked content (content referred to by href ).
Rev -- Relationship between the document and the linked content (content referred to by href)
Shape -- when using an image map, you can use shape to specify the link area.
Tabindex -- indicates the order in which links are traversed using the "tab" key.
Target -- indicates which window or framework should be opened by this link.
Title -- Additional prompt information of the link
Type -- indicates the MIME type of the link.