测试:修订间差异

来自SOKA CAFE
第4行: 第4行:
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>自适应轮播图</title>
     <title>自适应轮播图</title>
    <style>
        /* 容器:图片+文字横向排列(强制图片在左) */
        .header-container {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 20px; /* 图片和文字的间距 */
            margin: 20px 0;
            flex-direction: row; /* 强制横向排列 */
        }
        /* 锁定图片尺寸为100x100px */
        .header-logo {
            width: 100px;
            height: 100px;
            overflow: hidden;
            flex-shrink: 0; /* 防止图片被压缩 */
        }
        .header-logo img {
            width: 100%;
            height: 100%;
            object-fit: contain; /* 保持图片完整显示 */
        }
        /* 文字区域样式(两句话垂直排列) */
        .text-area {
            display: flex;
            flex-direction: column;
            gap: 5px; /* 两句话的间距 */
        }
        /* 标题样式(匹配示例图字体) */
        .main-title {
            font-size: 22px;
            font-weight: bold;
            color: #000;
            font-family: sans-serif;
        }
        .sub-title {
            font-size: 16px;
            color: #555;
            font-family: sans-serif;
        }
        /* 小屏幕适配(保持图片在左,文字换行) */
        @media (max-width: 768px) {
            .header-container {
                flex-direction: row;
                flex-wrap: wrap;
                text-align: left;
            }
        }
    </style>
</head>
</head>
<body>
<body>
    <!-- 图片+文字容器 -->
     <div style="font-size: min(4vw, 26px); margin-top: 20px; text-align: center; font-family: serif; padding: 0 10px;">
     <div class="header-container">
         <b>欢迎来到「SOKA CAFE——エア本中文维基」</b>
        <!-- 图片(维基文件路径) -->
    </div>
         <div class="header-logo">
    <div style="font-size: min(3vw, 18px); margin-bottom: 15px; text-align: center; margin-top: 10px; padding: 0 10px;">
            <img src="https://soka.cafe/Special:FilePath/Soka Cafe Favicon.png" alt="SOKA CAFE标志">
        頭がパーン@wiki:中華エア本支部
        </div>
        <!-- 文字区域(两句话垂直排列) -->
        <div class="text-area">
            <div class="main-title">— SOKA CAFE —「エア本中文维基」</div>
            <div class="sub-title">頭がパーン@wiki_CHN:中華エア本支部 ▼</div>
        </div>
     </div>
     </div>
</body>
</body>

2026年1月30日 (五) 16:53的版本

自适应轮播图

欢迎来到「SOKA CAFE——エア本中文维基」
頭がパーン@wiki:中華エア本支部


— SOKA CAFE — 「エア本中文维基」
頭がパーン@wiki_CHN:中華エア本支部
頭がパーン@wiki_CHN:中華エア本支部
◆ 本站点是以创价学会成员为核心、以创价学会及其相关团体为线索组织,进行讨论、研究和二次创作的公益性交流论坛维基百科网站。
◆ 本站点仅作记录和展示由宗教及相关人物衍生出的亚文化,非正式宗教维基,请注意!
◆ 本站点致力于营造和谐的社区环境,并热烈期待和欢迎任何人参与建设我们的网站!
◆ 本站点中所遇到的任何问题,均可通过下方信息联系我们。让我们一起共同来建设SOKA CAFE吧!
「よく来たわね、いらしゃい。」

本站点当前已有98个条目,3,154次编辑,2个活跃成员,上传了758个文件



自适应轮播图


Archive
📚 资料与档案
  • Creation
    🪶 术语与二创
  • Schedule
    🗓︎ 日程参照
    Create

    💻 创建页面

    感谢您对SOKA CAFE的编辑贡献!但也请在过程中务必依照创作协议及版权,遵循CC BY-SA 3.0协议!

    准备好了?来尝试创建页面吧!
     
    Notice

    ⚠️ 入站须知

    Soka Cafe一直是一个合作性、公益性的网站,我们致力于营造和谐的社区环境,并热情地欢迎任何人参与我们之间的创作,不论您的信仰、外表、地域.... 为了打造一个和谐的、无骚扰的社区环境,请通读入站须知,了解网站的性质及规则。

    Plan

    📄 任务计划

    Soka Cafe的基本底层已大体完确! 现在的最紧要的人物是登场作品分区的规范及完成度!这对创学新人入坑的帮助极其重要! 没有相关技术不要紧,请使用“可视化编辑器”来进行编辑!如果有任何技术问题请在页面下方获取我们的联系方式!