css on click |css3flex布局平均分

p {
font-size: 16px;
font-weight: bold;
color: #333;
cursor: pointer;
}
p:hover {
color: #f00;
}
p:active {
color: #00f;
}

首先，大家需要为要触发CSS On Click的元素设置样式。在上面的代码中，大家为所有的段落元素设置了字体大小、字重、颜色和光标样式。大家还为鼠标停留在元素上时设置了另一个样式，并在点击时设置了另一个样式。

在上面的代码中，大家使用了:hover伪类来设置停留样式，使用了:active伪类来设置点击样式。 :hover伪类表示鼠标停留在元素上时所触发的样式，而:active伪类表示点击时所触发的样式。

实际上，大家可以使用任何CSS属性来设置CSS On Click效果。例如，大家可以使用背景颜色来创建一个点击效果，如下所示：

button {
background-color: #333;
color: #fff;
border: none;
padding: 10px 20px;
cursor: pointer;
}
button:focus {
outline: none;
}
button:active {
background-color: #f00;
}

在上面的代码中，大家为按钮元素设置了背景颜色、字体颜色、边框和填充。大家还为获得焦点时设置了样式，并在点击时设置了另一个样式。

总之，CSS On Click是一种非常有用的技术，可以帮助大家增加交互性，并提高用户体验。无论是在网页设计中还是应用程序开发中，都应该掌握这个技术。