philosophyship-mobile
Version:
philosophship-mobile 手机端H5 ui 样式库
51 lines • 2.17 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1, width=device-width, maximum-scale=1, user-scalable=no">
<link rel="stylesheet" href="../src/tuitui-ui.css">
<title>推推UI-Loading加载提示组件</title>
</head>
<body>
<div class="tt-content">
<!-- 页面加载提示组件 -->
<h1 class="tt-panel-title">页面加载提示组件</h1>
<div class="tt-panel-body">
<div class="tt-loading">
<i class="fa fa-circle-o-notch fa-spin tt-loading-icon"></i>
<span class="tt-loading-info">用力载入中...</span>
</div>
<div class="tt-loading">
<i class="fa fa-refresh tt-loading-icon"></i>
<span class="tt-loading-info">加载出错，点我重新加载</span>
</div>
</div>
<!-- 单行加载提示组件 -->
<h1 class="tt-panel-title">单行加载提示组件</h1>
<div class="tt-panel-body">
<div class="tt-loading-inline">
<span class="tt-loading-info">
<i class="fa fa-circle-o-notch fa-spin tt-loading-icon"></i>
用力加载中
</span>
</div>
<div class="tt-loading-inline">
<span class="tt-loading-info">
上拉加载更多
<i class="fa fa-long-arrow-up fa-vibrate-y tt-loading-icon"></i>
</span>
</div>
<div class="tt-loading-inline">
<span class="tt-loading-info">
我可是有底线的
</span>
</div>
<div class="tt-loading-inline">
<span class="tt-loading-info">
·
</span>
</div>
</div>
</div>
</body>
</html>