音乐播放器html5和css代码

以下是一个简单的 HTML5 音乐播放器的代码，包括一些 CSS 样式：

HTML 代码：

<div class="music-player">
  <audio id="audio-player" src="song.mp3"></audio>
  <div class="controls">
    <button id="play-btn" class="play-btn"></button>
    <div class="timeline">
      <div id="progress-bar" class="progress-bar"></div>
    </div>
  </div>
</div>

CSS 代码：

.music-player {
  width: 300px;
  height: 50px;
  background-color: #f9f9f9;
  border-radius: 5px;
  padding: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.play-btn {
  background-image: url(play.png);
  background-size: cover;
  width: 30px;
  height: 30px;
  border: none;
  outline: none;
  cursor: pointer;
}

.timeline {
  width: 200px;
  height: 4px;
  background-color: #e0e0e0;
  position: relative;
  margin: 0 10px;
}

.progress-bar {
  width: 0;
  height: 100%;
  background-color: #8bc34a;
  position: absolute;
  left: 0;
  top: 0;
}

这是一个非常基本的音乐播放器，它只有一个播放/暂停按钮和一个进度条。你需要添加更多的功能和样式来使它更完整，但这个代码可以作为一个很好的起点。