HTML5(H5)hover伪类

hover伪类

        .box{

                width: 200px;

                height: 200px;

                /*background-color: red;*/

                /*边框*/

                border: 2px solid black;

                /*过渡：当样式发生改变的样式

                             值1：  所有的属性

                             值2：  改变所用的时间 单位 s 秒

                */

                transition: all 2s;

        }

hover

        作用：鼠标移入移出的时候触发指定样式

        鼠标移入时；触发hover的样式

        鼠标移出时：回到初始样式。整个hover中的代码，都不会被加载

        ：后面的hover 是固定的写法

        ：前面是要添加hover伪类的 目标 (目标尽量不要写成标签选择器)

        指定的目标：最好是单一的

        使用hover伪类时，将 子代(后代)选择器 写在hover之后会表示：

        ：前面是触发者

        hover之后的是显示者

代码示例：

        .box:hover>p{

                            width: 500px;

                            border-radius: 20%;

                            background-color: yellow;

        }