feat 電子書

This commit is contained in:
2026-05-15 14:50:20 +08:00
parent 95dabb9389
commit 904f3ebffd
27 changed files with 231 additions and 121 deletions
+13 -12
View File
@@ -41,14 +41,14 @@
display: flow-root;
}
body.totoga2-page #totoga2-reader .chronicle-chapter > h2,
body.totoga2-page #totoga2-reader .chronicle-chapter > p {
body.totoga2-page #totoga2-reader .chronicle-chapter>h2,
body.totoga2-page #totoga2-reader .chronicle-chapter>p {
clear: both;
position: relative;
z-index: 1;
}
body.totoga2-page #totoga2-reader .chronicle-chapter > .container {
body.totoga2-page #totoga2-reader .chronicle-chapter>.container {
width: calc(100% + 2 * var(--totoga-chapter-pad-inline));
margin-left: calc(-1 * var(--totoga-chapter-pad-inline));
margin-right: calc(-1 * var(--totoga-chapter-pad-inline));
@@ -60,6 +60,8 @@
}
}
totoga2.html
/* 含圖列:必須寫在含 #totoga2-reader 的選取器上,否則會輸給上一段 #totoga2-reader .container 的 height,圖會溢出蓋住後文 */
body.totoga2-page #totoga2-reader.chronicle-reader .container:has(img) {
height: auto;
@@ -174,19 +176,18 @@
<main class="content-container chronicle-reader" id="totoga2-reader" data-mode="scroll">
<article class="chronicle-chapter active" id="challenge" data-title="無限挑戰">
<!-- 序號一:第一列 container21(右欄 float:right+ container22(左欄 float:left)→ 畫面左 01、右 02 -->
<!-- 序號二:第二列單一全寬 container11 -->
<div class="container">
<div class="container11">
<img src="../assets/images/totoga2/web/cover.jpg" alt="六六歌2">
</div>
</div>
<div class="container">
<div class="container22">
</div>
<div class="container21">
<img src="../assets/images/totoga2/jpg/2023_電子書_無限挑戰六六歌2_final跨頁_頁面_01.jpg"
alt="六六歌2 電子書跨頁圖(序號一 · 右)">
</div>
</div>
<!-- 序號二:第二列單一全寬 container11 -->
<div class="container">
<div class="container11">
<img src="../assets/images/totoga2/jpg/2023_電子書_無限挑戰六六歌2_final跨頁_頁面_03.jpg"
alt="六六歌2 電子書跨頁圖(序號二 · 全寬)">
<img src="" alt="六六歌2 電子書跨頁圖(序號一 · 右)">
</div>
</div>
<h2>04 無限挑戰</h2>