fix: 修复页面布局和交互问题

调整CSS样式改善元素对齐和文本换行
优化音频播放器进度条交互逻辑
移除未使用的代码和console.log
添加窗口大小变化的事件监听
修复标签云重新初始化问题
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-09-25 18:53:56 +08:00
parent d61f57ed71
commit e378e383f6
6 changed files with 43 additions and 30 deletions

View File

@@ -1,7 +1,6 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- 基本元数据 -->
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
@@ -12,13 +11,13 @@
<meta name="theme-color" content="#1e135e" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<!-- 网站标题和描述 -->
<title>朴见潮音官网 - AI音乐创作先锋品牌</title>
<meta name="description" content="朴见潮音是国内领先的AI音乐创作品牌致力于通过人工智能技术推动音乐创作的创新与发展。" />
<meta name="keywords" content="朴见潮音,AI音乐,人工智能音乐,音乐创作,AI作曲" />
<meta name="author" content="朴见潮音" />
<!-- 社交媒体元数据 -->
<meta property="og:title" content="朴见潮音官网 - AI音乐创作先锋品牌" />
<meta property="og:description" content="朴见潮音是国内领先的AI音乐创作品牌致力于通过人工智能技术推动音乐创作的创新与发展。" />
@@ -26,13 +25,12 @@
<meta property="og:url" content="https://www.pujian.com" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="朴见潮音" />
<!-- 网站图标 -->
<link rel="shortcut icon" href="./static/img/favicon.ico" type="image/x-icon" />
<link rel="apple-touch-icon" href="./static/img/logo.png" />
<link rel="icon" href="./static/img/favicon.ico" type="image/x-icon" />
<script src="./static/js/vue.global.js"></script>
<script src="./static/js/artplayer.js"></script>
<script src="./static/js/axios.min.js"></script>
@@ -193,7 +191,7 @@
<img class="bj" src="./static/img/custom-bj-1.png" />
<img class="bj" src="./static/img/custom-bj-2.png" />
<img class="bj" src="./static/img/custom-bj-1.png" />
</div>
</div>
</div>
</div>
@@ -252,8 +250,8 @@
<div class="bottom-middle flexcenter">
<div class="flexacenter" style="margin-bottom: 10px">
<div class="time-display">{{ currentTimeFormatted }}</div>
<div class="progress-bar flexacenter" @click="handleBarDragBottomClick">
<div class="bar white" :style="{ width: progress + '%' }" @mousedown="startBarDragBottom"></div>
<div class="progress-bar flexacenter" @mousedown="startBarDragBottom">
<div class="bar white" :style="{ width: progress + '%' }"></div>
<div class="bar black flex1"></div>
</div>
<div class="time-display">{{ durationFormatted }}</div>