单文件HTML视频展示片生成器
来自 Wikiprompt,自由的提示词百科全书
单文件HTML视频展示片生成器 一个全面的提示,用于在单个HTML文件中构建视频展示片生成器,涵盖故事板、脚本、视觉序列、音频指导和制作检查表功能,并支持数据持久化。
提示词内容收藏
🌐
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Showreel Studio · generator</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}
:root {
--bg: #f4f6fb;
--surface: #ffffff;
--text: #1e1f2a;
--muted: #5b5e6e;
--border: #e2e4ee;
--accent: #4f46e5;
--accent-soft: #eef2ff;
--shadow: 0 8px 20px rgba(0, 0, 0, 0.03);
--radius: 20px;
--chip-bg: #f0f2f8;
}
body.dark {
--bg: #0f1117;
--surface: #1a1d27;
--text: #f0f2ff;
--muted: #a6adc2;
--border: #2d3242;
--accent: #818cf8;
--accent-soft: #232740;
--shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
--chip-bg: #262b3a;
}
body {
background: var(--bg);
color: var(--text);
transition: background 0.2s, color 0.2s;
padding: 24px 20px 60px;
line-height: 1.5;
}
.app {
max-width: 1300px;
margin: 0 auto;
}
.topbar {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 16px;
margin-bottom: 28px;
}
.logo {
font-weight: 700;
font-size: 1.6rem;
letter-spacing: -0.02em;
display: flex;
align-items: center;
gap: 8px;
}
.logo span {
background: var(--accent);
color: white;
padding: 4px 12px;
border-radius: 40px;
font-size: 0.8rem;
font-weight: 600;
}
.controls {
display: flex;
gap: 12px;
flex-wrap: wrap;
}
.btn {
background: var(--surface);
border: 1px solid var(--border);
color: var(--text);
padding: 8px 16px;
border-radius: 40px;
font-weight: 500;
font-size: 0.9rem;
cursor: pointer;
transition: 0.2s;
display: inline-flex;
align-items: center;
gap: 6px;
box-shadow: var(--shadow);
}
.btn:hover {
border-color: var(--accent);
color: var(--accent);
}
.btn.primary {
background: var(--accent);
border: none;
color: white;
}
.btn.primary:hover {
opacity: 0.9;
color: white;
}
.grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
gap: 20px;
margin-bottom: 24px;
}
.card {
background: var(--surface);
border-radius: var(--radius);
padding: 20px;
box-shadow: var(--shadow);
border: 1px solid var(--border);
transition: 0.2s;
}
.card-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 16px;
}
.card-header h3 {
font-size: 1.1rem;
font-weight: 600;
display: flex;
align-items: center;
gap: 8px;
}
.badge {
background: var(--accent-soft);
color: var(--accent);
padding: 2px 10px;
border-radius: 30px;
font-size: 0.7rem;
font-weight: 600;
}
.field {
margin-bottom: 14px;
}
.field label {
display: block;
font-size: 0.8rem;
font-weight: 500;
color: var(--muted);
margin-bottom: 4px;
}
.field input, .field select, .field textarea {
width: 100%;
padding: 10px 12px;
border-radius: 14px;
border: 1px solid var(--border);
background: var(--bg);
color: var(--text);
font-size: 0.9rem;
outline: none;
transition: 0.2s;
}
.field input:focus, .field select:focus, .field textarea:focus {
border-color: var(--accent);
box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}
.row {
display: flex;
gap: 12px;
flex-wrap: wrap;
}
.row .field {
flex: 1;
min-width: 120px;
}
.scene-item {
background: var(--bg);
border-radius: 16px;
padding: 14px;
margin-bottom: 12px;
border-left: 4px solid var(--accent);
}
.scene-item .scene-top {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 8px;
}
.scene-item .shot-type {
font-weight: 600;
font-size: 0.8rem;
background: var(--accent-soft);
padding: 2px 10px;
border-radius: 30px;
}
.scene-item p {
font-size: 0.9rem;
color: var(--muted);
}
.scene-item .duration {
font-weight: 500;
color: var(--text);
font-size: 0.8rem;
}
.placeholder-img {
background: linear-gradient(135deg, #c7d2fe, #a5b4fc);
height: 70px;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
color: #1e1b4b;
font-size: 0.8rem;
font-weight: 500;
margin: 8px 0;
}
.audio-chip {
background: var(--chip-bg);
padding: 6px 12px;
border-radius: 30px;
font-size: 0.8rem;
display: inline-block;
margin: 4px 4px 0 0;
}
.checklist-item {
display: flex;
align-items: center;
gap: 10px;
padding: 8px 0;
border-bottom: 1px solid var(--border);
}
.checklist-item input[type="checkbox"] {
accent-color: var(--accent);
width: 18px;
height: 18px;
}
.export-block {
background: var(--bg);
border-radius: 16px;
padding: 16px;
margin-top: 16px;
font-size: 0.9rem;
}
.export-block pre {
white-space: pre-wrap;
font-family: 'SF Mono', monospace;
font-size: 0.8rem;
max-height: 200px;
overflow-y: auto;
}
.color-dot {
display: inline-block;
width: 16px;
height: 16px;
border-radius: 50%;
margin-right: 6px;
border: 1px solid rgba(0,0,0,0.1);
}
.flex-between {
display: flex;
justify-content: space-between;
align-items: center;
}
.mt-2 {
margin-top: 12px;
}
.accent-color-input {
width: 40px;
height: 40px;
border-radius: 12px;
border: 1px solid var(--border);
background: transparent;
cursor: pointer;
}
.placeholder-img {
background: var(--chip-bg);
display: flex;
align-items: center;
justify-content: center;
color: var(--muted);
font-size: 0.8rem;
border-radius: 12px;
height: 60px;
border: 1px dashed var(--border);
}
</style>
</head>
<body>
<div class="app">
<div class="topbar">
<div class="logo">🎬 Showreel <span>generator</span></div>
<div class="controls">
<button class="btn" id="themeToggle">🌙 dark</button>
<button class="btn" id="exportJson">⬇️ export JSON</button>
<button class="btn" id="importJson">📂 import</button>
<input type="file" id="importFile" accept=".json" style="display:none">
<button class="btn primary" id="generateAll">✨ regenerate all</button>
</div>
</div>
<!-- brief + templates -->
<div class="grid">
<div class="card">
<div class="card-header"><h3>📋 project brief</h3><span class="badge">editable</span></div>
<div class="field"><label>project name</label><input id="projectName" value="Aurora launch"></div>
<div class="row">
<div class="field"><label>length</label><select id="videoLength"><option>15s</option><option selected>30s</option><option>60s+</option></select></div>
<div class="field"><label>tone</label><select id="toneSelect"><option>Professional</option><option>Casual</option><option selected>Dramatic</option><option>Educational</option></select></div>
</div>
<div class="field"><label>target audience</label><input id="audience" value="creators & marketers"></div>
<div class="field"><label>key message</label><textarea id="keyMessage" rows="2">bold innovation meets simplicity</textarea></div>
<div class="field"><label>style refs</label><input id="styleRefs" value="neon, motion blur, high contrast"></div>
<div class="row mt-2">
<button class="btn" id="templateProduct">🚀 product</button>
<button class="btn" id="templatePortfolio">🎨 portfolio</button>
<button class="btn" id="templatePromo">📣 promo</button>
<button class="btn" id="templateEdu">🎓 edu</button>
</div>
</div>
<!-- storyboard -->
<div class="card">
<div class="card-header"><h3>🎞️ storyboard</h3><button class="btn small" id="editStoryboard">✎ edit</button></div>
<div id="storyboardContainer"></div>
<button class="btn small mt-2" id="exportStoryboard">⬇️ export storyboard</button>
</div>
<!-- script -->
<div class="card">
<div class="card-header"><h3>📝 script</h3><span class="badge">auto</span></div>
<div class="row">
<div class="field"><label>length</label><select id="scriptLength"><option>15s</option><option selected>30s</option><option>60s+</option></select></div>
<div class="field"><label>tone</label><select id="scriptTone"><option>Professional</option><option>Casual</option><option selected>Dramatic</option><option>Humorous</option></select></div>
<div class="field"><label>voice</label><select id="voiceSelect"><option>Male</option><option selected>Female</option><option>Neutral</option></select></div>
</div>
<div id="scriptOutput" class="export-block" style="white-space: pre-line; min-height: 80px;"></div>
<button class="btn small mt-2" id="exportScript">📄 export script</button>
</div>
</div>
<!-- visual sequence + audio -->
<div class="grid">
<div class="card">
<div class="card-header"><h3>🌈 visual sequence</h3><button class="btn small" id="customizeVisuals">🎛️ customize</button></div>
<div id="visualSequence"></div>
</div>
<div class="card">
<div class="card-header"><h3>🎧 audio direction</h3><span class="badge">auto</span></div>
<div class="field"><label>music mood</label><select id="musicMood"><option>Upbeat</option><option selected>Cinematic</option><option>Relaxed</option><option>Dramatic</option></select></div>
<div class="row">
<div class="field"><label>voiceover</label><select id="voStyle"><option>Warm</option><option selected>Deep</option><option>Bright</option></select></div>
<div class="field"><label>balance</label><select id="balance"><option>VO +6dB</option><option selected>VO +3dB</option><option>Music +3dB</option></select></div>
</div>
<div id="audioNotes" class="export-block mt-2"></div>
<button class="btn small mt-2" id="exportAudio">📋 export notes</button>
</div>
</div>
<!-- checklist + final output -->
<div class="grid">
<div class="card">
<div class="card-header"><h3>✅ production checklist</h3><button class="btn small" id="addChecklistItem">+ add</button></div>
<div id="checklistContainer"></div>
<button class="btn small mt-2" id="exportChecklist">📋 export checklist</button>
</div>
<div class="card">
<div class="card-header"><h3>📦 final output</h3><span class="badge">preview</span></div>
<div id="finalPreview" class="export-block"></div>
<div class="row mt-2">
<button class="btn" id="exportFullReport">📄 full report</button>
<button class="btn" id="copyLink">🔗 copy share link</button>
</div>
</div>
</div>
</div>
<script>
(function() {
// ---------- state ----------
let state = {
brief: {
projectName: 'Aurora launch',
videoLength: '30s',
tone: 'Dramatic',
audience: 'creative & marketers',
keyMessage: 'innovation meets simplicity',
styleRefs: 'neon, cinematic, high contrast'
},
storyboard: [],
script: '',
visualSeq: [],
audio: { music: 'Cinematic', vo: 'Deep', balance: 'VO +3dB' },
checklist: ['camera setup', 'lighting kit', 'mic + recorder', 'talent release'],
completed: [false, false, false, false]
};
// ---------- dom refs ----------
const $ = id => document.getElementById(id);
const storyboardDiv = $('storyboardContainer');
const scriptOut = $('scriptOutput');
const visualDiv = $('visualSequence');
const audioNotesDiv = $('audioNotes');
const checklistDiv = $('checklistContainer');
const finalPreview = $('finalPreview');
// ---------- helpers ----------
function generateStoryboard() {
const tone = $('toneSelect')?.value || state.brief.tone;
const scenes = [];
const shots = ['Wide', 'Medium', 'Close-up'];
const desc = ['establishing shot with neon accents', 'subject enters frame, dramatic light', 'detail macro, texture', 'wide silhouette', 'medium action', 'close-up emotion'];
const overlays = ['TITLE: "AURORA"', 'text: "the future"', 'graphic: pulse', 'text: "launch"', 'logo reveal', 'CTA: "learn more"'];
for (let i=0; i<5; i++) {
scenes.push({
shot: shots[i % 3],
desc: desc[i % desc.length] + ' ' + (state.brief.styleRefs || ''),
overlay: overlays[i % overlays.length],
duration: i===0? '4s' : (i===4?'6s':'3s'
});
}
state.storyboard = scenes;
renderStoryboard();
}
function renderStoryboard() {
const scenes = state.storyboard || [];
let html = '';
scenes.forEach((s, idx) => {
html += `<div class="scene-item">
<div class="scene-top"><span class="shot-type">${s.shot}</span><span class="duration">${s.duration}</span></div>
<p>${s.visual}</p>
<div class="placeholder-img">🎬 ref: ${s.overlay}</div>
</div>`;
});
projectDiv.innerHTML = html || '<p>no scenes</p>';
}
function generateScript() {
const len = $('scriptLength').value;
const tone = $('scriptTone').value;
const voice = $('voiceSelect').value;
let hook = '';
if (tone === 'Dramatic') hook = 'In a world where silence speaks...';
else if (tone === 'Professional') hook = 'Introducing the next standard.';
else hook = 'Hey, this changes everything.';
const body = 'We built this for creators. Simple, powerful, unforgettable.';
const cta = 'Join the movement.';
state.script = `${hook}\n\n${body}\n\n${cta}\n\n[voice: ${voice}]`;
scriptOut.textContent = state.script;
}
function generateVisualSeq() {
const palettes = ['#0f172a', '#3b82f6', '#f59e0b', '#ef4444'];
const visuals = [
{ scene: '1', visual: 'abstract neon waves', palette: ['#0f172a', '#3b82f6', '#f59e0b'], overlay: 'logo animation' },
{ scene: '2', visual: 'product macro', palette: ['#111827', '#6b7280', '#fbbf24'], overlay: 'text: "new"' },
{ scene: '3', visual: 'human hands typing', palette: ['#1e293b', '#818cf8', '#f472b6'], overlay: 'ui mockup' },
{ scene: '4', visual: 'city timelapse', palette: ['#0f172a', '#38bdf8', '#facc15'], overlay: 'speed lines' },
{ scene: '5', visual: 'abstract gradient', palette: ['#4c1d95', '#db2777', '#fcd34d'], overlay: 'end card' }
];
state.visualSeq = visuals;
let html = '';
visuals.forEach(v => {
html += `<div class="scene-item">
<div class="flex-between"><span class="shot-type">${v.scene}</span><span>🎬</span></div>
<p>${v.visual}</p>
<div>${v.color.map(c => `<span class="color-dot" style="background:${c}"></span>`).join('')}</div>
<div class="placeholder-img">overlay: ${v.overlay}</div>
</div>`;
});
visualDiv.innerHTML = html;
}
function renderAudio() {
const mood = $('musicMood').value;
const vo = $('voStyle').value;
const bal = $('balance').value;
state.audio = { music: mood, vo, balance: bal };
audioNotesDiv.innerHTML = `🎵 music: <b>${mood}</b> · SFX: subtle risers<br>🎙 voiceover: <b>${vo}</b> · balance: ${bal}`;
}
function renderChecklist() {
let html = '';
state.checklist.forEach((item, i) => {
html += `<div class="checklist-item">
<input type="checkbox" ${state.completed[i] ? 'checked' : ''} data-index="${i}">
<span>${item}</span>
</div>`;
});
checklistDiv.innerHTML = html;
document.querySelectorAll('#checklistContainer input[type=checkbox]').forEach(cb => {
cb.addEventListener('change', e => {
const idx = e.target.dataset.index;
state.completed[idx] = e.target.checked;
});
});
}
function renderFinal() {
finalPreview.innerHTML = `
<b>${state.brief.projectName}</b> · ${state.brief.videoLength} · ${state.brief.tone}<br>
🎞️ ${state.storyboard.length} scenes · 📝 script ready · 🌈 visual plan<br>
🎧 music: ${state.audio.music} · balance: ${state.audio.balance}<br>
✅ checklist: ${state.checklist.filter((_,i)=>state.completed[i]).length}/${state.checklist.length} done
`;
}
function refreshAll() {
// sync brief inputs
state.brief.projectName = $('projectName').value;
state.brief.videoLength = $('videoLength').value;
state.brief.tone = $('toneSelect').value;
state.brief.target = $('audience').value;
state.brief.keyMessage = $('keyMessage').value;
state.brief.styleRefs = $('styleRefs').value;
generateStoryboard();
generateScript();
renderVisualSeq();
renderAudio();
renderChecklist();
renderFinalPreview();
}
// ---------- event listeners ----------
$('generateAll').addEventListener('click', refreshAll);
// template buttons
$('templateProduct').addEventListener('click', () => {
$('projectName').value = 'Product launch';
$('toneSelect').value = 'Professional';
$('keyMessage').value = 'built for performance';
$('styleRefs').value = 'studio, clean, minimal';
refreshAll();
});
$('templatePortfolio').addEventListener('click', () => {
$('projectName').value = 'Portfolio 2025';
$('toneSelect').value = 'Dramatic';
$('keyMessage').value = 'creative vision';
$('styleRefs').value = 'art, bold, color';
refreshAll();
});
$('templatePromo').addEventListener('click', () => {
$('projectName').value = 'Promo drop';
$('toneSelect').value = 'Casual';
$('keyMessage').value = 'don’t miss out';
$('styleRefs').value = 'street, urban';
refreshAll();
});
$('templateEdu').addEventListener('click', () => {
$('projectName').value = 'Learn fast';
$('toneSelect').value = 'Educational';
$('keyMessage').value = 'simplify complex';
$('styleRefs').value = 'diagrams, friendly';
refreshAll();
});
// storyboard edit (regenerate)
$('regenerateStoryboard').addEventListener('click', () => {
generateStoryboard();
});
// script export
$('exportScript').addEventListener('click', () => {
const blob = new Blob([state.script], {type: 'text/plain'});
const a = document.createElement('a');
a.href = URL.createObjectURL(blob);
a.download = 'script.txt';
a.click();
});
// export storyboard
$('exportStoryboard').addEventListener('click', () => {
const text = state.storyboard.map(s => `${s.shot} | ${s.visual} | ${s.duration} | ${s.overlay}`).join('\n');
const blob = new Blob([text], {type: 'text/plain'});
const a = document.createElement('a');
a.href = URL.createObjectURL(blob);
a.download = 'storyboard.txt';
a.click();
});
// export audio
$('exportAudio').addEventListener('click', () => {
const text = `music: ${state.audio.music}\nVO: ${state.audio.vo}\nbalance: ${state.audio.balance}\nSFX: risers, whoosh`;
const blob = new Blob([text], {type: 'text/plain'});
const a = document.createElement('a');
a.href = URL.createObjectURL(blob);
a.download = 'audio-direction.txt';
a.click();
});
// checklist add
$('addChecklistItem').addEventListener('click', () => {
const item = prompt('new checklist item');
if (item) {
state.checklist.push(item);
state.completed.push(false);
renderChecklist();
renderFinalPreview();
}
});
// export checklist
$('exportChecklist').addEventListener('click', () => {
const text = state.checklist.map((c,i) => `${state.completed[i] ? '[x]' : '[ ]'} ${c}`).join('\n');
const blob = new Blob([text], {type: 'text/plain'});
const a = document.createElement('a');
a.href = URL.createObjectURL(blob);
a.download = 'checklist.txt';
a.click();
});
// export full report
$('exportFullReport').addEventListener('click', () => {
const report = `SHOWREEL REPORT\n${state.brief.projectName}\n${state.brief.videoLength} | ${state.brief.tone}\n\nSTORYBOARD:\n${state.storyboard.map(s=>`- ${s.shot} ${s.duration}: ${s.visual}`).join('\n')}\n\nSCRIPT:\n${state.script}\n\nVISUAL PLAN:\n${state.visualSeq.map(v=>`- ${v.scene}: ${v.visual}`).join('\n')}\n\nAUDIO: ${state.audio.music} / ${state.audio.vo} / ${state.audio.balance}\n\nCHECKLIST:\n${state.checklist.map((c,i)=>`${state.completed[i]?'[x]':'[ ]'} ${c}`).join('\n')}`;
const blob = new Blob([report], {type: 'text/plain'});
const a = document.createElement('a');
a.href = URL.createObjectURL(blob);
a.download = 'showreel-report.txt';
a.click();
});
// copy link (simulate)
$('copyLink').addEventListener('click', () => {
navigator.clipboard.writeText(`https://showreel.local/${state.brief.projectName.replace(/\s/g,'-')}`).then(() => alert('share link copied'));
});
// export JSON
$('exportJson').addEventListener('click', () => {
const blob = new Blob([JSON.stringify(state, null, 2)], {type: 'application/json'});
const a = document.createElement('a');
a.href = URL.createObjectURL(blob);
a.download = 'showreel-project.json';
a.click();
});
// import JSON
$('importJson').addEventListener('click', () => $('importFile').click());
$('importFile').addEventListener('change', (e) => {
const file = e.target.files[0];
if (!file) return;
const reader = new FileReader();
reader.onload = (ev) => {
try {
const imported = JSON.parse(ev.target.result);
state = { ...state, ...imported };
// sync inputs
$('projectName').value = state.brief.projectName;
$('videoLength').value = state.brief.videoLength;
$('toneSelect').value = state.brief.tone;
$('audience').value = state.brief.targetAudience;
$('keyMessage').value = state.brief.keyMessage;
$('styleRefs').value = state.brief.styleRefs;
refreshAll();
} catch { alert('invalid JSON'); }
};
reader.readAsText(file);
});
// dark mode
$('themeToggle').addEventListener('click', () => {
document.body.classList.toggle('dark');
$('themeToggle').textContent = document.body.classList.contains('dark') ? '☀️ light' : '🌙 dark';
});
// accent color customization (simple)
const accentInput = document.createElement('input');
accentInput.type = 'color';
accentInput.value = '#4f46e5';
accentInput.className = 'accent-color-input';
accentInput.style.marginLeft = '8px';
document.querySelector('.controls').appendChild(accentInput);
accentInput.addEventListener('input', (e) => {
document.documentElement.style.setProperty('--accent', e.target.value);
});
// customize visuals (just regenerate)
$('customizeVisual').addEventListener('click', () => {
renderVisualSeq();
});
// initial
(function init() {
// set brief defaults
state.brief = {
projectName: 'Aurora launch',
videoLength: '30s',
tone: 'Dramatic',
targetAudience: 'creative & marketers',
keyMessage: 'innovation meets simplicity',
styleRefs: 'neon, cinematic, high contrast'
};
$('projectName').value = state.brief.projectName;
$('videoLength').value = state.brief.videoLength;
$('toneSelect').value = state.brief.tone;
$('audience').value = state.brief.targetAudience;
$('keyMessage').value = state.brief.keyMessage;
$('styleRefs').value = state.brief.styleRefs;
refreshAll();
})();
// manual edit for storyboard (simple)
$('regenerateStoryboard').addEventListener('click', () => {
generateStoryboard();
});
// ensure storyboard container exists
function generateStoryboard() {
const scenes = [];
const shots = ['Wide', 'Medium', 'Close-up', 'Wide', 'Medium'];
const visuals = ['city skyline', 'product on pedestal', 'eye macro', 'silhouette', 'hand interaction'];
const overlays = ['"AURORA"', '"launch"', '"feel"', '"future"', '"CTA"'];
for (let i=0;i<5;i++) {
scenes.push({
shot: shots[i],
visual: `${visuals[i]} · ${state.brief.styleRefs}`,
overlay: overlays[i],
duration: i===0?'8s':i===4?'6s':'3s'
});
}
state.storyboard = scenes;
renderStoryboard();
}
function renderStoryboard() {
let html = '';
state.storyboard.forEach(s => {
html += `<div class="scene-item">
<div class="scene-top"><span class="shot-type">${s.shot}</span><span class="duration">${s.duration}</span></div>
<p>${s.visual}</p>
<div class="placeholder-img">🎬 ${s.overlay}</div>
</div>`;
});
$('storyboardContainer').innerHTML = html;
}
// sync audio on change
['musicMood','voStyle','balance'].forEach(id => {
$(id).addEventListener('change', () => {
renderAudio();
renderFinalPreview();
});
});
// script change
['scriptLength','scriptTone','voiceSelect'].forEach(id => {
$(id).addEventListener('change', () => {
generateScript();
renderFinalPreview();
});
});
// brief change
['projectName','videoLength','toneSelect','audience','keyMessage','styleRefs'].forEach(id => {
$(id).addEventListener('change', () => {
refreshAll();
});
});
// final init
refreshAll();
})();
</script>
</body>
</html>
用法
此提示词专为 coding 设计。复制上方内容并粘贴到你常用的 AI 工具中。
为获得最佳效果,可将占位符(方括号或大写字母标示)替换为你的具体需求。
讨论
0 条评论