CSS实现的loading页面等待效果

最新推荐文章于 2025-03-06 10:37:49 发布

babybk

最新推荐文章于 2025-03-06 10:37:49 发布

阅读量8.3k

点赞数

分类专栏： javasctipt 页面加载时间文章标签：页面加载

javasctipt 同时被 2 个专栏收录

62 篇文章

订阅专栏

页面加载时间

1 篇文章

订阅专栏

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>无标题文档</title>  
<style type="text/css">  
.loading{  
    width:160px;  
    height:56px;  
    position: absolute;  
    top:50%;  
    left:50%;  
    line-height:56px;  
    color:#fff;  
    padding-left:60px;  
    font-size:15px;  
    background: #000 url(https://img-my.youkuaiyun.com/uploads/201211/14/1352886927_7549.gif) no-repeat 10px 50%;  
    opacity: 0.7;  
    z-index:9999;  
    -moz-border-radius:20px;  
    -webkit-border-radius:20px;  
    border-radius:20px;  
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);  
}  
</style>  
</head>  

<body>  
<div id="loading" class="loading">正在全力加载中...</div>  
</body>  
</html>