MibooGram/resources/genshin/akasha/char_rank_example.html
2023-11-03 20:36:14 +08:00

128 lines
4.4 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Avatar List</title>
<link type="text/css" href="./style.css" rel="stylesheet"/>
<link type="text/css" href="../avatar_list/style.css" rel="stylesheet"/>
<link type="text/css" href="../../styles/public.css" rel="stylesheet"/>
<style>
.avatar > div::after {
background-position: center center;
background-size: cover;
background-image: url("../../background/rarity/half/5.png");
}
</style>
</head>
<body>
<div class="container">
<div class="head" style="background-image: url('../../assets/namecard/210081/navbar.png')">
<div class="avatar">
<div><img src="../../assets/avatar/10000002/icon.png" alt="avatar"></div>
</div>
<div class="player">
<div>
<div class="nickname">神里绫华</div>
<div class="uid">角色排行 共 199999 条数据</div>
</div>
</div>
<div class="logo"></div>
</div>
<div class="content">
<div class="row">
<div>#</div>
<div style="flex: 3">UID</div>
<div style="flex: 3">昵称</div>
<div style="flex: 3">暴击 : 暴伤</div>
<div style="flex: 2">生命值</div>
<div style="flex: 2">攻击力</div>
<div style="flex: 2">防御力</div>
<div style="flex: 2">精通</div>
<div style="flex: 2">充能</div>
<div style="flex: 2">HYPER</div>
</div>
<div class="row">
<div>1</div>
<div style="flex: 3">2222222</div>
<div style="flex: 3" class="username">
得得得得得得得得得
</div>
<div style="flex: 3">7.7 : 50.0</div>
<div style="flex: 2">20000</div>
<div style="flex: 2">2000</div>
<div style="flex: 2">2000</div>
<div style="flex: 2">1000</div>
<div style="flex: 2">300.0%</div>
<div style="flex: 2; background-color: rgb(229 171 229/70%)">451399</div>
</div>
</div>
<div style="height: 50px"></div>
<div class="content">
<div class="row">
<div>#</div>
<div style="flex: 3">UID</div>
<div style="flex: 3">昵称</div>
<div style="flex: 3">暴击 : 暴伤</div>
<div style="flex: 2">生命值</div>
<div style="flex: 2">攻击力</div>
<div style="flex: 2">防御力</div>
<div style="flex: 2">精通</div>
<div style="flex: 2">充能</div>
<div style="flex: 2">HYPER</div>
</div>
<div class="row">
<div>1</div>
<div style="flex: 3">2222222</div>
<div style="flex: 3" class="username">
得得得得得得得得得
</div>
<div style="flex: 3">7.7 : 50.0</div>
<div style="flex: 2">20000</div>
<div style="flex: 2">2000</div>
<div style="flex: 2">2000</div>
<div style="flex: 2">1000</div>
<div style="flex: 2">300.0%</div>
<div style="flex: 2; background-color: rgb(229 171 229/70%)">451399</div>
</div>
<div class="row second-row">
<div>2</div>
<div style="flex: 3">
<div>11111111</div>
</div>
<div style="flex: 3" class="username">
啊啊啊啊啊啊啊啊啊啊啊啊
</div>
<div style="flex: 3">7.7 : 50.0</div>
<div style="flex: 2">20000</div>
<div style="flex: 2">2000</div>
<div style="flex: 2">2000</div>
<div style="flex: 2">1000</div>
<div style="flex: 2">300.0%</div>
<div style="flex: 2">451398</div>
</div>
<div class="row">
<div>3</div>
<div style="flex: 3">
<div>3333333</div>
</div>
<div style="flex: 3" class="username">
姑姑姑姑姑姑过过过过
</div>
<div style="flex: 3">7.7 : 50.0</div>
<div style="flex: 2">20000</div>
<div style="flex: 2">2000</div>
<div style="flex: 2">2000</div>
<div style="flex: 2">1000</div>
<div style="flex: 2">300.0%</div>
<div style="flex: 2">451399</div>
</div>
</div>
</div>
</body>
</html>