零基础教你固定 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			body{
				height: 2000px;
				background-image:url(img/a64f1c8b363acfc3fef6995fc6777d61.jpg) ;/*背景图片*/
				background-repeat:repeat-x;/*背景图片重复*/
				background-position: left bottom;/*背景图片的位置,分为水平和垂直2个方向*/
				background-attachment: fixed;/*背景的固定*/
			}
			.back{
				position: fixed;
				right: 20px;
				bottom: 20px;
			}
			.end{
				/*底部中间图标固定*/
				position: fixed;
				left: 50%;
				bottom: 20px;
				transform: translateX(-50%);
			}
			.clock{
				position: fixed;
				left: 10%;
				bottom: 0px;
				color: gold;
			}
		</style>
	</head>
	<body>
		<h1 id="top">我是顶部</h1>
		<div class="back">
			<a href="#top"><img src="img/2c1034867ec53792b3e20d5d70ee6a1c.jpg"/></a>
		</div>
		<div class="end">
			<img src="img/710925abab72bee1129508c8d73e9eec.jpg"/>
		</div>
		<div class="clock">
			
		</div>
		<script type="text/javascript">
			window.onload=clock
			var b=15
//			let clock=document.querySelector('clock')
//			clock.innerHTML='将在x秒后自动刷新'
			function clock(){
				var a=document.getElementById('c')
				if(b>0){
					b=b-1
					a.innerHTML='将在'+b+'秒后离页面刷新'
				}else{
					b=15
					a.innerHTML='将在'+b+'秒后页面刷新'
				}
			}
			setTimeout('clock()',1000)
		</script>
	</body>
</html>

image-20260707084613165

posted @ 2026-07-07 08:49  崔雅楠  阅读(6)  评论(0)    收藏  举报