上篇:二、Flask学习之CSS
3.8hover
hover是用来美化鼠标悬停的效果的,当鼠标停放在某个区域,就会执行对应的hover操作。可以操作本标签的内容,也可以操作本标签下某一个标签的内容
3.9after
.name1:after{
content: "潘达";
}
after是用来在某个标签的最后添加某些东西:
3.10position
fixedrelativeabsolute
fixed(固定在窗口的某个位置) 案例:
.back{
position: fixed;
height: 60px;
width: 60px;
border: 3px solid orange;
bottom: 40px;/*距离底部40px*/
right: 0;/*距离右部40px*/
}
relative和absolute 一个标签相对于另一个标签的位置
.name1{
position: relative;
height: 300px;
width: 600px;
border: 3px solid orange;
top: 40px;
left: 50px;
}
.name1 .name2{
position: absolute;
height: 30px;
width: 60px;
border: 3px solid blue;
top: 40px;
left: 50px;
}
效果:
3.11border
border是上下左右都加边框,board-left是左边框,board-right是右边框以此类推 transparent是透明色
参考阅读
发表评论