Sr.No. | 类名和描述 |
1 |
progress
将元素标识为进度组件。 div 元素需要。
|
2 |
determinate
将基本的物化行为设置为进度指示器。
|
3 |
indeterminate
将动画设置为进度指示器。
|
<html> <head> <title>The Materialize Preloader Example</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/css/materialize.min.css"> <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/js/materialize.min.js"></script> </head> <body class="container"> <h4>default Preloader</h4> <div class="progress"> <div class="determinate" style="width: 50%"></div> </div> <h4>Indeterminate Preloader</h4> <div class="progress"> <div class="indeterminate"></div> </div> <h4>Circular Preloader</h4> <div class="preloader-wrapper big active"> <div class="spinner-layer spinner-blue-only"> <div class="circle-clipper left"> <div class="circle"></div> </div> <div class="gap-patch"> <div class="circle"></div> </div> <div class="circle-clipper right"> <div class="circle"></div> </div> </div> </div> </body> </html>