14 lines
10 KiB
JSON
14 lines
10 KiB
JSON
|
|
{
|
|||
|
|
"template_name": "Toy风",
|
|||
|
|
"description": "Toy风",
|
|||
|
|
"html_template": "<!DOCTYPE html>\n<html lang=\"zh-CN\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Toy风PPT模板</title>\n \n <!-- 引入外部字体和图标库 -->\n <link rel=\"preconnect\" href=\"https://fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https://fonts.gstatic.com\" crossorigin>\n <link href=\"https://fonts.googleapis.com/css2?family=Nunito:wght@700;900&display=swap\" rel=\"stylesheet\">\n <link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css\">\n \n <!-- 引入图表库 (示例) -->\n <script src=\"https://cdn.jsdelivr.net/npm/chart.js\"></script>\n <!-- <script src=\"https://cdn.jsdelivr.net/npm/echarts@5.4.2/dist/echarts.min.js\"></script> -->\n <!-- <script src=\"https://d3js.org/d3.v7.min.js\"></script> -->\n\n <style>\n /* \n * 所有CSS样式均内联在此<style>标签中,以确保模板的自包含性。\n * 这是比将style属性写在每个元素上更优、更易维护的“内联”实践。\n */\n\n /* 1. 基础与重置样式 */\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n html, body {\n width: 100%;\n height: 100%;\n overflow: hidden; /* 严格禁止页面出现滚动条 */\n background-color: #f0f2f5; /* 页面背景色,用于衬托幻灯片 */\n font-family: 'Nunito', sans-serif;\n }\n\n /* 2. 响应式缩放容器 */\n .slide-container {\n width: 100vw;\n height: 100vh;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n /* 3. 幻灯片核心画布 (严格1280x720) */\n .slide {\n width: 1280px;\n height: 720px;\n background-color: #FFFBEB; /* 温暖的米黄色背景,像画纸 */\n position: relative;\n overflow: hidden; /* 确保所有内容都在720px高度内 */\n transform-origin: center center; /* 设置缩放中心 */\n color: #333;\n box-shadow: 0 10px 30px rgba(0,0,0,0.1);\n }\n\n /* 4. 装饰性元素 (模拟积木/贴纸) */\n .deco-shape {\n position: absolute;\n border-radius: 50%;\n }\n .shape1 { background-color: #3B82F6; width: 150px; height: 150px; top: -50px; right: 50px; opacity: 0.8; }\n .shape2 { background-color: #FBBF24; width: 80px; height: 80px; top: 80px; right: -20px; opacity: 0.9; }\n .shape3 { background-color: #EF4444; width: 200px; height: 200px; bottom: -100px; left: -80px; opacity: 0.7; }\n .shape4 { background-color: #22C55E; width: 40px; height: 40px; bottom: 80px; left: 60px; }\n\n /* 5. 页面元素样式 */\n .page-title {\n position: absolute;\n top: 40px;\n left: 60px;\n background-color: #3B82F6; /* 鲜艳的蓝色标题背景 */\n color: white;\n padding: 15px 30px;\n border-radius: 15px;\n font-size: 36px;\n font-weight: 900;\n display: inline-block;\n box-shadow: 0 4px 10px rgba(59, 130, 246, 0.4);\n z-index: 10;\n }\n\n .page-content {\n position: absolute;\n top: 150px;\n left: 60px;\n right: 60px;\n bottom: 60px;\n padding: 20px;\n z-index: 5;\n }\n\n .pagination {\n position: absolute;\n bottom: 25px;\n right: 40px;\n font-size: 20px;\n font-weight: 700;\n color: #A1A1AA;\n background-color: rgba(255, 255, 255, 0.7);\n padding: 5px 15px;\n border-radius: 20px;\n z-index: 10;\n }\n\n /* 6. 内容区域具体样式 */\n .page-
|
|||
|
|
"tags": [
|
|||
|
|
"Toy风"
|
|||
|
|
],
|
|||
|
|
"is_default": false,
|
|||
|
|
"export_info": {
|
|||
|
|
"exported_at": "2025-10-04T06:53:14.666Z",
|
|||
|
|
"original_id": 16,
|
|||
|
|
"original_created_at": 1755855865.1131823
|
|||
|
|
}
|
|||
|
|
}
|