<div class="ranking">
<ul>
<li>1. 玩家A</li>
<li>2. 玩家B</li>
<li>3. 玩家C</li>
<li>4. 玩家D</li>
<li>5. 玩家E</li>
</ul>
</div>在这个例子中，大家使用了一个包含`ranking`类名的`div`元素作为整个排行榜的容器，然后在其中添加了一个无序列表`ul`，其中包含了每个玩家的排名和名字。接下来，大家可以使用CSS样式来为排行榜增加更多的装饰和特效。
下面是一些简单的CSS样式，可以用来改变排行榜的字体、颜色、对齐和背景颜色。
.ranking {
width: 400px;
margin: 0 auto;
font-size: 1.2em;
color: #333;
text-align: center;
background-color: #f3f3f3;
}
.ranking ul {
list-style: none;
padding: 0;
margin: 0;
}
.ranking li {
line-height: 2em;
border-bottom: 1px solid #ccc;
}
.ranking li:first-child {
font-weight: bold;
font-size: 1.5em;
color: #f00;
}在这些CSS样式中，大家首先为整个排行榜添加了一个400像素的宽度，并将其水平居中对齐。同时，大家也改变了排行榜的字体大小、颜色、对齐和背景颜色。下面，大家进一步为无序列表设置了一些基本的样式，比如去除了列表项的标记，设置了内外边距为0，并增加了每个列表项的行高和边框。最后，大家也为排行榜的第一个元素，即第一个玩家，添加了一些特殊的样式，比如加粗、放大和改变颜色。
有了这些CSS样式的支持，大家可以让排行榜的样式更加美观和具有吸引力。同时，也可以根据需要进行进一步的调整和修改，以满足设计要求。