轮播图中的小点
未hover时
background-color: rgba(255, 255, 255, .5);
background-clip: content-box;
border: 2px solid transparent;
hover时
background-color: #fff;
border: 2px solid rgba(255, 255, 255, .5);
超链接
display: block;可以设在a:link中
a:link{
display: block;
width: 93px;
height: 29px;
background-image: url("../image/btn.png");
}
a:hover{
background-image: url("../image/hover.png");
}
a:active{
background-image: url("../image/active.png")
}
设置下拉效果
height: 0px;
overflow: hidden;
transition: height .3s;
隐藏“小米官网”
text-indent: -9999px;
// display: block;
font-size: 0;
overflow: hidden;
两个行内元素代码换行会产生缝隙
让他们两个浮动,可解决
button的box-sizing默认为border-box
小米官网的to-top条
.to-top{
width: 40px;
height: 150px;
background-color: red;
position: fixed;
bottom: 250px;
right: 50%;
margin-right: -653px;
}
/*
布局的等式
left + margin-left + width + margin-right + right = 视口的宽度
auto + 0 + 40 + 0 + 60 = 视口宽度
auto + 0 + 40 + -639px + 50% = 视口宽度
*/