前端基础学习笔记 hover border-radius

hover

鼠标移入元素时 伪类
style:

div{
    width:200px;
    height:200px;
    background-color:pink;
}
鼠标移入效果：
div:hover{
    background-color:red;
    border:1px solid blue
}
p{
    display:none;//一开始消失
    width:100px;
    height:100px;
    background-color:blue;
}

加波浪线鼠标移入出现
div:hover ~p{
    display:block;
}

border-radius

%
宽高一样时50%是圆 不一样时 椭圆
px
px值大于等于宽高一半时 是圆
一个值 四个方向
两个值 左上右下 和 右上左下
三个值 左上 右上左下 右下
四个值 左下 右上 右下 左上