写一段骨架屏的代码实现

以下是一个简单的骨架屏代码实现示例：

HTML部分：

<div class="skeleton">
  <div class="skeleton-header"></div>
  <div class="skeleton-content">
    <div class="skeleton-item"></div>
    <div class="skeleton-item"></div>
    <div class="skeleton-item"></div>
  </div>
</div>

CSS部分：

.skeleton {
  background-color: #f2f2f2;
  border-radius: 5px;
  padding: 20px;
}

.skeleton-header {
  height: 50px;
  width: 100%;
  background-color: #ddd;
  border-radius: 5px;
  margin-bottom: 20px;
}

.skeleton-content {
  display: flex;
  flex-direction: column;
}

.skeleton-item {
  height: 20px;
  width: 100%;
  background-color: #ddd;
  border-radius: 5px;
  margin-bottom: 10px;
}

这里的骨架屏是一个包含头部和内容的盒子，内容部分是一个包含多个骨架条目的列表。通过设置背景颜色和圆角等属性，可以实现看起来像真实内容的效果。在实际使用中，可以根据不同的需求和布局进行调整。