html侧边悬浮图片
时间: 2024-01-01 10:23:32 浏览: 109
以下是一个示例的HTML代码,用于创建一个侧边悬浮图片:
```html
<!DOCTYPE html>
<html>
<head>
<style>
.container {
position: relative;
width: 100%;
height: 100vh;
}
.image {
position: fixed;
top: 50%;
left: 0;
transform: translateY(-50%);
width: 100px;
height: 100px;
background-image: url("your-image-url.jpg");
background-size: cover;
background-position: center;
z-index: 9999;
}
</style>
</head>
<body>
<div class="container">
<div class="image"></div>
</div>
</body>
</html>
```
在上面的代码中,我们使用了CSS的`position: fixed`属性来实现悬浮效果。通过设置`top`和`left`属性来调整悬浮图片的位置。你可以将`your-image-url.jpg`替换为你自己的图片链接。
阅读全文