javascript 5秒后关闭广告案例

最新推荐文章于 2023-04-12 20:20:17 发布

weixin_30839881

最新推荐文章于 2023-04-12 20:20:17 发布

阅读量385

点赞数 1

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/knuzy/p/8835104.html

本文介绍了一个使用HTML和CSS创建的固定位置图片与居中显示文本的网页案例。通过设置图片的位置属性和文本的样式属性，实现了图片固定在屏幕上下10%的位置，而文本内容则位于页面中央的效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6     <style>
 7         body {
 8             height: 2000px;
 9         }
10         img {
11             position: fixed;
12             top: 10%;
13             /*margin-top: -220px;*/
14         }
15         .img1 {
16             left: 10px;
17         }
18         .img2 {
19             right: 10px;
20         }
21         div {
22             width: 800px;
23             margin: 150px auto;
24             color: pink;
25             /*text-align: center;*/
26             font: 700 25px/1.3 "simSun";
27         }
28     </style>
29 </head>
30 <body>
31     <img class="img1" src="images/1.gif" alt="">
32     <img class="img2" src="images/2.gif" alt="">
33     <div>
34         Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam quis at enim suscipit expedita perferendis nesciunt rem, fugiat labore itaque dignissimos rerum laborum quam laudantium pariatur! Quasi voluptas sunt, corrupti. Nihil ullam ex magni, veniam, rem sint illo quasi corporis fugit laudantium, eaque possimus molestias iusto ea qui culpa facilis accusamus mollitia quod sapiente. Beatae aliquam illo dolore culpa saepe, reprehenderit voluptates ullam atque minima nostrum distinctio iure, ducimus molestias odit placeat quas nisi ab, molestiae accusantium animi! Beatae numquam deserunt, maxime asperiores nemo voluptates, neque atque expedita corporis facere ducimus laboriosam, cumque! Facilis tempora est ducimus id, consectetur necessitatibus?
35     </div>
36     <script>
37         
38 
39         var imgArr = document.getElementsByTagName("img");
40         //设置定时器
41         setTimeout(fn,5000);
42         function fn(){
43             imgArr[0].style.display = "none";
44             imgArr[1].style.display = "none";
45         }
46     </script>
47 </body>
48 </html>