杨帆 发表于 2026-7-20 12:16

爱我中华

本帖最后由 杨帆 于 2026-7-20 14:23 编辑 <br /><br /><!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>爱我中华</title>
<style>
#container {left:calc(50% - 81px);transform:translateX(-50%);margin: 30px auto;width:1280px;height:750px;border: 2px solid gold;border-radius: 12px;background:url("https://pic1.imgdb.cn/i/033sVswnoqqh0kbKbyptiP.gif") no-repeat center/cover;position: relative;overflow: visible;z-index: 1;background: #0a0a1a;box-shadow: 0 0 40px rgba(68, 136, 255, 0.15), inset 0 0 60px rgba(68, 136, 255, 0.05);--bg:url('https://www.llz123.net/llz/llz/mulu/zongge/nv.gif') no-repeat /;}
.dancer {position: absolute;transform:translate(-50%,-50%);top:50%;left:50%;width: 320px;height:427px;background:var(--bg);z-index: 10;}
#bg-layer {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;overflow: hidden;pointer-events: none;}
#bg-image {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;display: block;}
#bg-video {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: fill;display: block;z-index: 2;}
#bg-overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 2;pointer-events: none;background-color: #0a0a1a;opacity: 0.0;}
#lyric-area {position: absolute;bottom: 112px;left: 50%;transform: translateX(-50%);width: 92%;height: 170px;z-index: 20;pointer-events: none;overflow: visible;perspective: 900px;perspective-origin: 50% 85%;}
#lrc-wrapper {position: relative;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;overflow: visible;transform: rotateX(28deg) scaleY(0.55);transform-origin: bottom center;transform-style: preserve-3d;}
.lrc-line {position: relative;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;overflow: visible;transform-style: preserve-3d;}
.char-arc {position: absolute;display: inline-block;white-space: nowrap;font-size: 48px;font-weight: 700;font-family: '华文宋体','PingFang SC', 'Microsoft YaHei', sans-serif;line-height: 1.4;color:#FFFF00 !important;text-shadow:-1px -1px 0 #ffffff,1px -1px 0 #ffffff,-1px1px 0 #ffffff,1px1px 0 #ffffff,0 0 8px rgba(255, 255, 255, 0.2);transition: opacity 0.12s ease-out, color 0.15s ease, text-shadow 0.15s ease, transform 0.15s ease;opacity: 0.25;transform-origin: center center;transform-style: preserve-3d;backface-visibility: hidden;}
.char-arc.highlight {color: #ff44ff;text-shadow:-1px -1px 0 #ffffff,1px -1px 0 #ffffff,-1px1px 0 #ffffff,1px1px 0 #ffffff,0 0 20px rgba(255, 68, 255, 0.8),0 0 40px rgba(255, 68, 255, 0.5),0 0 80px rgba(255, 68, 255, 0.3);transform: scale(1.12) translateZ(8px);opacity: 1;}
.char-arc.done {color: #cc4444;text-shadow:-1px -1px 0 #ffffff,1px -1px 0 #ffffff,-1px1px 0 #ffffff,1px1px 0 #ffffff;opacity: 0.7;transform: scale(0.95);}
#play-control {position: absolute;top: 35px;left: 30px;z-index: 25;display: flex;flex-direction: column;gap: 4px;padding: 6px 0 4px 0;min-width: 280px;pointer-events: auto;}
#spectrum-container {width: 100%;height: 32px;display: flex;align-items: flex-end;justify-content: center;gap: 1.5px;padding-bottom: 2px;}
#spectrum-container .bar {flex: 1;height: 3px;min-height: 2px;background: #ff0000;border-radius: 1px 1px 0 0;transition: height 0.08s ease-out;box-shadow: 0 0 4px rgba(255, 0, 0, 0.15);max-width: 4px;}
#progress-row {display: flex;align-items: center;gap: 8px;width: 100%;}
#time-display,#duration-display {font-size: 18px;font-family: monospace;letter-spacing: 0.5px;min-width: 36px;text-align: center;flex-shrink: 0;font-weight: bold;background: linear-gradient(90deg, #ff0066, #ff6600, #ffcc00, #33ff66, #00ccff, #9966ff, #ff0066);background-size: 300% 100%;-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;animation: rainbowText 4s linear infinite;}
@keyframes rainbowText {0% {background-position: 0% 50%;}100% {background-position: 300% 50%;}}
#duration-display {animation-delay: 0.5s;}
#time-display.paused, #duration-display.paused {animation-play-state: paused;}
#progress-bar {flex: 1;height: 3px;background: rgba(255, 255, 255, 0.15);border-radius: 2px;cursor: pointer;position: relative;pointer-events: auto;}
#progress-fill {width: 0%;height: 100%;background: linear-gradient(90deg, #ffd700, #ffaa00);border-radius: 2px;transition: width 0.1s linear;}
#play-btn-container {position: absolute;top: 30px;right: 30px;z-index: 25;width: 120px;height: 120px;cursor: pointer;pointer-events: auto;transition: all 0.3s ease;}
#play-btn-container:hover {transform: scale(1.1);}
#play-btn-container img {width: 100%;height: 100%;object-fit: cover;display: block;animation: float 3s ease-in-out infinite alternate;}
.stop #play-btn-img {animation-play-state: paused;}
.song-info-vertical {position: absolute;writing-mode: vertical-rl;text-orientation: mixed;font-weight: bold;font-family: '华文琥珀', 'PingFang SC', 'Segoe UI', cursive;letter-spacing: 6px;z-index: 30;pointer-events: none;filter: drop-shadow(0 0 8px rgba(255, 200, 0, 0.7));white-space: nowrap;color: transparent;}
.song-info-vertical.title { left: 57.7%;top: 3%;font-size: 1.4rem; height: 120px; }
.song-info-vertical.artist { left: 37.4%;top: 3%;font-size: 1.1rem;}
.song-info-vertical::before {position: absolute;content: attr(data-text);top: 0;left: 0;width: 100%;height: 0%;color: #FFD966;background: linear-gradient(to bottom, #FFBF00, #FF7F00, #FFD966);background-clip: text;-webkit-background-clip: text;overflow: hidden;white-space: nowrap;filter: drop-shadow(0 0 5px #ffaa44);animation: textFillVertical 5.2s infinite alternate ease-in-out;text-shadow:-1px -1px 0 #ff0000,1px -1px 0 #ff0000,-1px1px 0 #ff0000,1px1px 0 #ff0000,0 0 4px rgba(255, 68, 0, 0.5);writing-mode: vertical-rl;text-orientation: mixed;}
.song-info-vertical.pause-animation::before {animation-play-state: paused !important;}
@keyframes textFillVertical {0% {height: 0%;letter-spacing: 8px;opacity: 0.7;}40% {letter-spacing: 2px;}100% {height: 100%;letter-spacing: 1px;opacity: 1;}}
#label {position: absolute;top: 14px;right: 115px;color: rgba(68, 136, 255, 0.3);font-size: 11px;letter-spacing: 2px;pointer-events: none;z-index: 10;font-weight: 300;text-transform: uppercase;}
#hover-hint {position: absolute;bottom: 200px;left: 50%;transform: translateX(-50%);color: rgba(68, 136, 255, 0.25);font-size: 12px;letter-spacing: 2px;pointer-events: none;z-index: 10;font-weight: 300;}
#hover-status {position: absolute;bottom: 16px;right: 100px;color: rgba(68, 136, 255, 0.2);font-size: 10px;letter-spacing: 1px;pointer-events: none;z-index: 10;font-weight: 300;}
#hover-status.active {color: rgba(68, 136, 255, 0.6);}
#fullscreen {position: absolute;text-align: center;min-width: 80px;border-radius:4px;color:DarkGray;padding:4px 8px;z-index:12;font-size:25px;border:none;cursor:pointer;bottom:25px;left:25px;background:transparent;}
#fullscreen:active {transform: translateY(2px);box-shadow: 0 1px 0 rgba(0,0,0,0.15);}
#fullscreen:hover {transform: scale(1.1);transition: transform 0.12s ease;color:#007bff;font-weight: bold;}
@keyframes float {0%{transform:translateY(0);}100%{transform:translateY(-20px);}}
</style>
</head>
<body>
<div id="container">
<div id="fullscreen">全屏欣赏</div>
<div id="label"></div>
<div id="bg-layer">
<div class="dancer"></div>
<img id="bg-image" src="" alt="背景图片">
<video id="bg-video" src="" muted loop playsinline></video>
<div id="bg-overlay"></div>
</div>
<div id="lyric-area">
<div id="lrc-wrapper"></div>
</div>
<div class="song-info-vertical title" data-text="爱我中华">爱我中华</div>
<div class="song-info-vertical artist" data-text="演唱:宋祖英">演唱:宋祖英</div>
<div id="play-control">
<div id="spectrum-container"></div>
<div id="progress-row">
<span id="time-display">00:00</span>
<div id="progress-bar">
<div id="progress-fill"></div>
</div>
<span id="duration-display">00:00</span>
</div>
</div>
<div id="play-btn-container">
<img id="play-btn-img" src="https://pic1.imgdb.cn/item/6a2b7067240596c6e205be33.png" alt="播放">
</div>
<div id="hover-hint"></div>
<div id="hover-status"></div>
</div>
<script>
const container = document.getElementById('container');
const bgImage = document.getElementById('bg-image');
const bgVideo = document.getElementById('bg-video');
const dancer = document.querySelector('.dancer');
const bgOverlay = document.getElementById('bg-overlay');
const playBtnImg = document.getElementById('play-btn-img');
const playBtnContainer = document.getElementById('play-btn-container');
const timeDisplay = document.getElementById('time-display');
const durationDisplay = document.getElementById('duration-display');
const lrcWrapper = document.getElementById('lrc-wrapper');
const progressFill = document.getElementById('progress-fill');
const progressBar = document.getElementById('progress-bar');
const spectrumContainer = document.getElementById('spectrum-container');
function loadBackground() {
    const img = new Image();
    img.onload = () => {
      bgImage.src = '';
      bgImage.style.display = 'none';
    };
    img.onerror = () => bgImage.style.display = 'none';
    img.src = '';
}
function loadVideo() {
    bgVideo.src = 'https://video-qn.51miz.com/preview/video/00/00/17/35/V-173563-D3AD8387.mp4';
    bgVideo.style.display = 'block';
    bgVideo.style.opacity = 1.0;
    bgVideo.play().catch(() => {});
}
bgOverlay.style.opacity = 0.0;
loadBackground();
loadVideo();
let isPlaying = false;
const audio = new Audio();
audio.src = 'https://www.joy127.com/url/155752.mp3';
audio.preload = 'auto';
audio.loop = true;
function syncAllElements(playing) {
    isPlaying = playing;
    if (playing) audio.play().catch(() => {});
    else audio.pause();
    playBtnImg.src = playing ? 'https://pic1.imgdb.cn/item/6a2b701e240596c6e205bda9.gif' : 'https://pic1.imgdb.cn/item/6a2b7067240596c6e205be33.png';
    const bg1 = `url('https://www.llz123.net/llz/llz/mulu/zongge/nv.gif') no-repeat 50% 25%/320px 427px`;
    const bg2 = `url('https://www.llz123.net/llz/llz/mulu/zongge/nv.png') no-repeat 50% 25%/320px 427px`;
    const titleEl = document.querySelector('.song-info-vertical.title');
    const artistEl = document.querySelector('.song-info-vertical.artist');
    if (playing) {
      titleEl.classList.remove('pause-animation');
      artistEl.classList.remove('pause-animation');
      container.style.setProperty('--bg', bg1);
      timeDisplay.classList.remove('paused');
      durationDisplay.classList.remove('paused');
      startSpectrum();
      bgVideo.play().catch(() => {});
    } else {
      titleEl.classList.add('pause-animation');
      artistEl.classList.add('pause-animation');
      container.style.setProperty('--bg', bg2);
      timeDisplay.classList.add('paused');
      durationDisplay.classList.add('paused');
      stopSpectrum();
      bgVideo.pause();
    }
}
const BAR_COUNT = 48;
let spectrumBars = [];
let spectrumInterval = null;
function createSpectrumBars() {
    spectrumContainer.innerHTML = '';
    spectrumBars = [];
    for (let i = 0; i < BAR_COUNT; i++) {
      const bar = document.createElement('div');
      bar.className = 'bar';
      bar.style.height = '3px';
      spectrumContainer.appendChild(bar);
      spectrumBars.push(bar);
    }
}
createSpectrumBars();
function updateSpectrum() {
    if (!isPlaying || audio.paused) return;
    spectrumBars.forEach((bar, index) => {
      const t = Date.now() / 200;
      const base = Math.sin(t + index * 0.35) * 0.5 + 0.5;
      const random = Math.random() * 0.5;
      const val = Math.min(1, base * 0.6 + random * 0.4);
      const height = 3 + val * 26;
      bar.style.height = Math.max(3, height) + 'px';
      const brightness = 40 + val * 60;
      bar.style.background = `hsl(0, 100%, ${brightness}%)`;
      bar.style.boxShadow = `0 0 ${3 + val * 6}px rgba(255, 0, 0, ${0.15 + val * 0.4})`;
    });
}
function startSpectrum() {
    if (spectrumInterval) clearInterval(spectrumInterval);
    spectrumInterval = setInterval(updateSpectrum, 50);
}
function stopSpectrum() {
    if (spectrumInterval) { clearInterval(spectrumInterval); spectrumInterval = null; }
    spectrumBars.forEach(bar => {
      bar.style.height = '3px';
      bar.style.background = '#ff0000';
      bar.style.boxShadow = '0 0 4px rgba(255, 0, 0, 0.15)';
    });
}
const LRC_LYRICS = `爱我中华
演唱:宋祖英
爱我中华 爱我中华
赛罗罗赛罗罗赛罗罗赛罗罗赛罗罗
赛罗罗赛罗罗赛罗罗 嘿
五十六个星座 五十六支花
五十六族兄弟姐妹是一家
五十六种语言 汇成一句话
爱我中华 爱我中华 爱我中华
嗨啰咿啰嘿啰嘿 嗨啰咿啰嘿啰嘿
嗨啰咿啰嘿啰咿啰嘿啰 爱我中华
五十六个星座 五十六支花
五十六族兄弟姐妹是一家
五十六种语言 汇成一句话
爱我中华 爱我中华 爱我中华
爱我中华 健儿奋起步伐
爱我中华 建设我们的国家
爱我中华 中华雄姿英发
爱我中华 五十六族 兄弟姐妹
五十六种语言汇成一句话 爱我中华
五十六个星座 五十六支花
五十六族兄弟姐妹是一家
五十六种语言 汇成一句话
爱我中华 爱我中华 爱我中华
嗨啰咿啰嘿啰嘿 嗨啰咿啰嘿啰嘿
嗨啰咿啰嘿啰咿啰嘿啰 爱我中华
五十六个星座 五十六支花
五十六族兄弟姐妹是一家
五十六种语言 汇成一句话
爱我中华 爱我中华 爱我中华
嗨啰咿啰嘿啰嘿 嗨啰咿啰嘿啰嘿
嗨啰咿啰嘿啰咿啰嘿啰 爱我中华
五十六个星座 五十六支花
五十六族兄弟姐妹是一家
五十六种语言 汇成一句话
爱我中华 爱我中华 爱我中华
爱我中华 健儿奋起步伐
爱我中华 建设我们的国家
爱我中华 中华雄姿英发
爱我中华 五十六族 兄弟姐妹
五十六种语言汇成一句话
爱我中华 嘿`;
function parseLrc(text) {
    const lines = text.split('\n');
    const result = [];
    const timeRegex = /\[(\d{2}):(\d{2})\.(\d{2,3})\]/;
    for (const line of lines) {
      const trimLine = line.trim();
      if (!trimLine) continue;
      const match = trimLine.match(timeRegex);
      if (!match) continue;
      const minutes = parseInt(match);
      const seconds = parseInt(match);
      let millis = parseInt(match);
      if (match.length === 2) millis *= 10;
      const time = minutes * 60 + seconds + millis / 1000;
      const lrcText = trimLine.replace(/\[\d{2}:\d{2}\.\d{2,3}\]/g, '').trim();
      if (!lrcText) continue;
      result.push({ time, text: lrcText });
    }
    result.sort((a, b) => a.time - b.time);
    if (result.length && result.time > 0) result.unshift({ time: 0, text: result.text });
    return result;
}
const lrcData = parseLrc(LRC_LYRICS);
let currentLine = -1;
let highlightTimer = null;
const ARC_RADIUS_X = 650;
const ARC_RADIUS_Y = 680;
const CHAR_SPACING = 45;
const ARC_CENTER_Y = 100;
const HIGHLIGHT_ADVANCE = 0.25;
function generateArcLyricHTML(text) {
    if (!text) return '<div class="lrc-line" style="color:#ff0000;font-size:28px;text-align:center;justify-content:center;align-items:center;display:flex;text-shadow:-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff;">等待歌词...</div>';
    const chars = text.split('');
    const n = chars.length;
    const deltaAngle = CHAR_SPACING / ARC_RADIUS_X;
    const totalAngle = (n - 1) * deltaAngle;
    const startAngle = -totalAngle / 2;
    const centerY = ARC_CENTER_Y + ARC_RADIUS_Y;
    const positions = [];
    let minX = Infinity, maxX = -Infinity, minY = Infinity, maxY = -Infinity;
    for (let i = 0; i < n; i++) {
      const angle = startAngle + i * deltaAngle;
      const x = ARC_RADIUS_X * Math.sin(angle);
      const y = ARC_RADIUS_Y * Math.cos(angle) - ARC_RADIUS_Y;
      const absX = x;
      const absY = centerY + y;
      const rotateDeg = -angle * (180 / Math.PI);
      positions.push({ x: absX, y: absY, rotate: rotateDeg });
      minX = Math.min(minX, absX);
      maxX = Math.max(maxX, absX);
      minY = Math.min(minY, absY);
      maxY = Math.max(maxY, absY);
    }
    const offsetX = -(minX + maxX) / 2;
    const offsetY_lyric = -(minY + maxY) / 2 + 30;
    let html = '<div class="lrc-line">';
    for (let i = 0; i < n; i++) {
      const { x, y, rotate } = positions;
      const finalX = x + offsetX;
      const finalY = y + offsetY_lyric;
      const safeChar = chars.replace(/[&<>]/g, m => ({'&':'&amp;','<':'&lt;','>':'&gt;'} || m));
      html += `<span class="char-arc" style="transform: translate(${finalX}px, ${finalY}px) rotate(${rotate}deg); opacity: 0.25;" data-index="${i}">${safeChar}</span>`;
    }
    html += '</div>';
    return html;
}
function clearHighlightTimer() {
    if (highlightTimer) clearTimeout(highlightTimer);
    highlightTimer = null;
}
function startKTVEffect(containerEl, startIndex) {
    clearHighlightTimer();
    const charSpans = containerEl.querySelectorAll('.char-arc');
    if (!charSpans.length) return;
    charSpans.forEach(span => {
      span.classList.remove('highlight', 'done');
      span.style.opacity = '0.25';
    });
    for (let i = 0; i < startIndex; i++) {
      charSpans.classList.add('done');
      charSpans.style.opacity = '0.7';
    }
    let idx = startIndex;
    function highlightNext() {
      if (idx >= charSpans.length) return;
      if (idx > 0) {
            charSpans.classList.remove('highlight');
            charSpans.classList.add('done');
            charSpans.style.opacity = '0.7';
      }
      charSpans.classList.add('highlight');
      charSpans.style.opacity = '1';
      idx++;
      highlightTimer = setTimeout(highlightNext, 280);
    }
    if (idx < charSpans.length) {
      charSpans.classList.add('highlight');
      charSpans.style.opacity = '1';
      idx++;
      highlightTimer = setTimeout(highlightNext, 280);
    }
}
function refreshLyricLine(text, startCharIndex = 0) {
    lrcWrapper.innerHTML = generateArcLyricHTML(text);
    const lineDiv = lrcWrapper.querySelector('.lrc-line');
    if (!lineDiv) return;
    const hasChars = lineDiv.querySelector('.char-arc');
    if (hasChars) setTimeout(() => startKTVEffect(lineDiv, startCharIndex), 100);
}
function updateLrcByTime(currentTime) {
    if (!lrcData.length) return;
    let activeIndex = 0;
    for (let i = lrcData.length - 1; i >= 0; i--) {
      if (lrcData.time <= currentTime + HIGHLIGHT_ADVANCE) {
            activeIndex = i;
            break;
      }
    }
    if (activeIndex === currentLine) return;
    currentLine = activeIndex;
    const currentLrc = lrcData;
    const nextLrc = currentLine + 1 < lrcData.length ? lrcData : null;
    const lineDuration = nextLrc ? (nextLrc.time - currentLrc.time) : 3;
    const elapsedInLine = currentTime + HIGHLIGHT_ADVANCE - currentLrc.time;
    const progress = Math.min(Math.max(elapsedInLine / lineDuration, 0), 1);
    const charCount = currentLrc.text.length;
    refreshLyricLine(currentLrc.text, Math.floor(progress * charCount));
}
function formatTime(seconds) {
    if (isNaN(seconds) || !isFinite(seconds)) return "00:00";
    const mins = Math.floor(seconds / 60);
    const secs = Math.floor(seconds % 60);
    return `${mins.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;
}
playBtnContainer.addEventListener('click', () => {
    syncAllElements(!isPlaying);
});
audio.addEventListener('play', () => {
    if (!isPlaying) syncAllElements(true);playBtnContainer.classList.remove('stop');playBtnImg.title="暂停";
});
audio.addEventListener('pause', () => {
    if (isPlaying) syncAllElements(false);playBtnContainer.classList.add('stop');playBtnImg.title="播放";
});
audio.addEventListener('timeupdate', () => {
    const current = audio.currentTime;
    const duration = audio.duration || 0;
    progressFill.style.width = (duration > 0 ? current / duration * 100 : 0) + '%';
    timeDisplay.textContent = formatTime(current);
    durationDisplay.textContent = formatTime(duration);
    updateLrcByTime(current);
});
audio.addEventListener('loadedmetadata', () => {
    durationDisplay.textContent = formatTime(audio.duration);
});
progressBar.addEventListener('click', (e) => {
    const rect = progressBar.getBoundingClientRect();
    const percent = (e.clientX - rect.left) / rect.width;
    if (audio.duration) audio.currentTime = percent * audio.duration;
});
refreshLyricLine('爱我中华');
setTimeout(() => {
    syncAllElements(true);
}, 500);
const fullscreen = document.getElementById('fullscreen');
const papa = document.getElementById('container');
let fs = true,fsTimer;
fullscreen.onclick = ()=>{
if(fs){
    fullscreen.innerText = '退出全屏';
    papa.requestFullscreen();
}else{
    fullscreen.innerText = '全屏欣赏';
    document.exitFullscreen();
}
fs = !fs;
};
papa.addEventListener('mousemove', () => {
clearTimeout(fsTimer);
fullscreen.style.opacity = '1';
fsTimer = setTimeout(() => fullscreen.style.opacity = '0', 2500);
});
</script>
</body>
</html>

杨帆 发表于 2026-7-20 12:25

代码来自了了子老师分享作品,在此表示感谢{:4_190:}

梦江南 发表于 2026-7-20 12:37

杨帆 发表于 2026-7-20 12:25
代码来自了了子老师分享作品,在此表示感谢

好像帖子评不了分,页面有点变形。

梦江南 发表于 2026-7-20 12:39

现在正常了,欣赏精彩音画。{:4_187:}

梦油 发表于 2026-7-20 14:12

人物与背景颜色的搭配反差很大,看起来很舒服。

红影 发表于 2026-7-20 19:22

好漂亮的半圆形歌词展示方式,十分出彩。鸽子的播放器也漂亮。
欣赏杨帆好帖{:4_199:}

杨帆 发表于 2026-7-20 20:26

梦江南 发表于 2026-7-20 12:39
现在正常了,欣赏精彩音画。

谢谢江南鼓励,祝夏安{:4_204:}

杨帆 发表于 2026-7-20 20:26

梦油 发表于 2026-7-20 14:12
人物与背景颜色的搭配反差很大,看起来很舒服。

谢谢梦兄鼓励,祝夏安{:4_190:}

杨帆 发表于 2026-7-20 20:27

红影 发表于 2026-7-20 19:22
好漂亮的半圆形歌词展示方式,十分出彩。鸽子的播放器也漂亮。
欣赏杨帆好帖

谢谢影子鼓励,祝夏安{:4_187:}

梦油 发表于 2026-7-21 11:07

杨帆 发表于 2026-7-20 20:26
谢谢梦兄鼓励,祝夏安

杨帆朋友别客气。

红影 发表于 2026-7-22 20:24

杨帆 发表于 2026-7-20 20:27
谢谢影子鼓励,祝夏安

不客气啊,问好杨帆{:4_187:}
页: [1]
查看完整版本: 爱我中华