Home > Web Front-end > HTML Tutorial > CSS pseudo-class and pseudo-object selection (5)_html/css_WEB-ITnose

CSS pseudo-class and pseudo-object selection (5)_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:46:28
Original
1362 people have browsed it

1. Pseudo-selectors

Pseudo-selectors include: pseudo-class selectors and pseudo-object selectors, prefixed with a colon (:), followed by a pseudo-class or Pseudo object name, there are no spaces before and after the colon, otherwise it will be parsed as containing the selector

such as:

div:hover{ font-size:12px;}/*div为指定标签名hover选择符,伪类 或者 伪元素名*/
Copy after login

Pseudo selector is specially used Select elements or objects in special areas or special states. These special areas or special states cannot be precisely controlled through tag selectors, ID selectors or class selectors

2. Pseudo-class selectors and pseudo-class selectors Object selector

伪类 说明
:focus 定义对象在成为输入焦点(该对象的onfocus事件发生时)的样式
:first-child 定义对象的第一个子对象的样式
:first   定义页岩 容器第一页使用的样式,仅适用于@page规则
:left 定义页面容器位于装订线左边的所有页面使用的样式,仅适用于@page规则
:right 定义页面容器位于装订线右边的所有页面使用的样式,仅适用于@page规则
:lang 定义对象使用特殊语言的内容样式

伪对象 说明
:after 与content属性一起使用,定义在对象后的内容
:before 与content属性一起使用,定义在对象前的内容
:first-letter 定义对象内第一个字符的样式
:first-line   定义对象内第一行的样式

3. Hyperlink

@charset "utf-8";/* CSS Document *//*超链接默认样式*/a{    text-decoration:none;    color:#333333;}/*访问过的样式*/a:visited{    color:#0000ff;}/*鼠标经过样式*/a:hover{    color:#00ff00;}/*鼠标按下样式*/a:active{    color:#FF0000;
Copy after login

There is another one: link can define unvisited Hyperlink style, you can use a selector instead of a:link selector style.

: link and :visited are called link pseudo-classes and can only be applied to anchor elements;

:hover, :active and :focus are called dynamic Pseudo-class, which can theoretically be applied to any element.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template