悬浮按钮只需要设置按钮positi的属性为fixed即可。
例子:
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>浮动按钮</title>
<style>
*
{
margin: 0px
padding: 0px
}
#container
{
width: 1000px
height: 3000px
background-color: #1b6d85
margin: auto
}
#div1
{
height: 600px
background-color: #255625
}
#div2
{
height: 600px
background-color: #c0a16b
}
#div3
{
height: 600px
background-color: #b92c28
}
#div4
{
height: 600px
background-color: #449d44
}
#div5
{
height: 600px
background-color: #999999
}
.btn-style
{
width: 30px
height: 120px
position: fixed/*此处即是固定按钮位置的属性。*/
left: 1500px
top: 400px
}
</style>
</head>
<body>
<button class="btn-style">这是一个浮动按钮</button>
<div id="container">
<div id="div1">第一节</div>
<div id="div2">第二节</div>
<div id="div3">第三节</div>
<div id="div4">第四节</div>
<div id="div5">第五节</div>
</div>
</body>
</html>
效果图:
代码如下,望采纳<head>
<style>
* {
margin: 0
padding: 0
box-sizing: border-box
}
div{
width: 300px
height: 300px
transition: all 2s
background: #3ff
}
div:hover{
transform: rotateZ(45deg)
}
</style>
</head>
<div></div>
html记事本屏幕旋转打开设置之后找到【显示与亮度】。2.
然后进去,能看到【自动旋转屏幕】,将它打开就可以了。
3.
也可以在下拉菜单中打开旋转。
4.
浏览网页你会不会觉得手机屏幕宽度不够,看许多大的网页看不完整,缩小后字体小的看不清,很不爽很不爽。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)