Home > Web Front-end > CSS Tutorial > Introduction to the use of pseudo-classes and pseudo-elements

Introduction to the use of pseudo-classes and pseudo-elements

王林
Release: 2020-10-30 16:54:23
forward
2267 people have browsed it

Introduction to the use of pseudo-classes and pseudo-elements

css pseudo-classes and pseudo-elements

line-height (official definition of line height: two lines of text baseline aligned)

(Video tutorial recommendation: css video tutorial)

Target pseudo-class

:link    (a:link 未访问的链接  浏览器有缓存!!所以刷新没用)
	a:active{color:   ;}
:active (长按住)
:visited (已经访问的链接)
:hover (鼠标放上去)
:focus (获取用户焦点)
Copy after login

Pseudo element (it is an inline element that cannot set width and height)

::after  (在元素后面添加内容)
::before  (在元素前面添加内容)
display:...
	inline-block(能够设置高度,和行内元素并排显示)
	inline
	block(独占一行)
	none(隐藏
Copy after login

css properties

	继承(一个元素如果没有设置某个属性的值,那么就会跟随父属性的值。如果设置了,就用自己的值)
		color ,font-size  line-height text-align
	层叠(后面的样式会覆盖前面的样式)
		当选择器相同时 后面的选择器会覆盖前面的
		当选择器不同时,根据选择器的权重设置
Copy after login

List

	ul(无序列表)
	ol   (有序列表)
Copy after login

Table

table
		tr单元行
		td单元格
		boder 边框
		cellpadding   单元格内部的间距
		cellspacing 单元格之间的距离
		width 表格的宽度
		align 表格的水平对齐方式
Copy after login

Css element type division (according to whether the element can be displayed in one line)

	块级元素 (独占父元素的一行) 常用的块级元素 
		●	div
		●	p
		●	h1-h6
		●	ul--li
		●	table
		●	from
Copy after login

Inline-level elements (Can be displayed on the same line as other inline elements)

		●	img
		●	span
		●	a
	●	inupt
Copy after login

Related recommendations:CSS tutorial

The above is the detailed content of Introduction to the use of pseudo-classes and pseudo-elements. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:csdn.net
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