From 960b32ee8aa6d5a4c5e3bcc35e2c97aa58ed0ed8 Mon Sep 17 00:00:00 2001 From: 闫增涛 <1829501689@qq.com> Date: 星期二, 11 二月 2025 11:25:55 +0800 Subject: [PATCH] 奇偶页边距 --- src/books/toddlerGameImplementation/assets/main.less | 310 ++++++++++++++++++++++++++++++++------------------- 1 files changed, 195 insertions(+), 115 deletions(-) diff --git a/src/books/toddlerGameImplementation/assets/main.less b/src/books/toddlerGameImplementation/assets/main.less index b6b2179..6ef25dc 100644 --- a/src/books/toddlerGameImplementation/assets/main.less +++ b/src/books/toddlerGameImplementation/assets/main.less @@ -81,6 +81,10 @@ width: 100%; } + .mk-img { + height: 100%; + } + .w90 { width: 90%; } @@ -130,6 +134,9 @@ font-size: 18px !important; } + .fm-kt { + font-family: "kaiti"; + } .img-0 { width: 100%; @@ -146,6 +153,10 @@ .td-0 { text-indent: 0em !important; } + + // .td-{ + + // } .td-1 { text-indent: 1em !important; @@ -220,7 +231,7 @@ } .ta-l { - text-align: left; + text-align: left !important; } .wh-no { @@ -233,6 +244,10 @@ .pad-l-60 { padding-left: 60px; + } + + .mb-25 { + margin-bottom: 25px; } .mb-45 { @@ -259,13 +274,18 @@ } .headerNumber { - width: 90px; + width: 110px; color: #fff; font-size: 12px; - padding-left: 10px; text-align: left; - background-color: #6BCFF6; - border-radius: 15px 0 0 15px; + position: relative; + padding-bottom: 5px; + + span { + position: absolute; + top: 33%; + left: 25%; + } } .header-left-Number { @@ -276,10 +296,11 @@ border-radius: 15px; position: relative; - span{ + span { position: absolute; - left: 50%; + left: 56%; top: 35%; + transform: translateX(-50%); } } @@ -383,7 +404,7 @@ margin-left: 20px; p { - margin: 0 !important; + margin: 0; } } @@ -470,8 +491,20 @@ width: 150px; } + .w140 { + width: 140px; + } + .w135 { width: 135px; + } + + .w130 { + width: 130px; + } + + .w120 { + width: 120px; } .w115 { @@ -515,6 +548,22 @@ font-size: 14px; } } + + .jc-img { + margin-bottom: -5px; + cursor: pointer; + } + + + .textarea-box { + width: 100%; + overflow: auto; + word-break: break-all; + resize: none; + border: 1px solid #01AFEE; + border-radius: 5px; + background-color: rgba(255, 255, 255, 0); +} .table-title-bc { background-color: #8091BC; @@ -876,6 +925,20 @@ } } + .inputChoice { + display: flex; + align-items: center; + + input { + margin: 0 5px; + cursor: pointer; + } + + span { + cursor: pointer; + } + } + .parimary-btn { cursor: pointer; min-width: 80px; @@ -1044,24 +1107,22 @@ } - .bodystyle:nth-of-type(odd) { + .page-box:nth-child(odd) .bodystyle { font-family: 'FZLTXIHJW'; text-align: justify; - margin: 0 12% 0 8%; + margin: 0 11% 0 9%; padding-bottom: 80px; line-height: 30px; - - - hr { - font-weight: 800; - margin-left: 0; - margin-top: 10px; - margin-bottom: 10px; - width: 25%; - } + // hr { + // font-weight: 800; + // margin-left: 0; + // margin-top: 10px; + // margin-bottom: 10px; + // width: 25%; + // } } - .bodystyle:nth-of-type(even) { + .page-box:nth-child(even) .bodystyle { font-family: 'FZLTXIHJW'; text-align: justify; margin: 0 9% 0 11%; @@ -1161,9 +1222,9 @@ font-family: 'FZLTXIHJW'; text-align: center; font-size: 12px; - margin-left: 0%; - margin-right: 0%; + margin: 15px 0 !important; text-indent: 0em; + color: #00AFEF; } .img1 { @@ -1228,7 +1289,7 @@ .right { text-align: right; margin-left: 0%; - margin-right: 0%; + margin-right: 4%; } .left1 { @@ -1276,8 +1337,8 @@ line-height: 2em; color: #01AFEE; font-weight: bold; - font-size: 1.9em; - margin-bottom: 1em; + font-size: 2.2em; + margin-bottom: 20px; margin-top: -0.5em; text-indent: 0em; @@ -1304,17 +1365,18 @@ h2 { font-family: 'FZHTJW'; color: #00ADEF; - font-weight: bold; + font-weight: 400; font-size: 1.6em; margin-bottom: 0em; - margin-top: 0.1em; + margin-top: 0.3em; text-indent: 2em; + line-height: 1.3em; } .h2-zt { font-family: 'FZHTJW'; color: #00ADEF; - font-weight: bold; + font-weight: 400; font-size: 1.4em; margin-top: 0em; text-indent: 2.2em; @@ -1326,8 +1388,8 @@ color: #03AFED; font-weight: bold; font-size: 1.3em; - margin-bottom: 1em; - margin-top: 1em; + margin-bottom: 0.5em; + margin-top: 0.7em ; text-indent: 0em; } @@ -1335,8 +1397,8 @@ font-family: 'FZHTJW'; font-weight: bold; color: #03AFED; - margin-bottom: 0.5em; - margin-top: 1em; + margin-bottom: 0.2em; + margin-top: 0.2em; font-size: 1.2em; text-indent: 1em; } @@ -1345,8 +1407,8 @@ font-family: 'FZHTJW'; color: #03AFED; - margin-bottom: 0.5em; - margin-top: 1em; + margin-bottom: 0.2em; + margin-top: 0.2em; font-size: 1.15em; text-indent: 2em; } @@ -1480,6 +1542,10 @@ margin-right: 0.5em; } + .ls1 { + color: #00B1F5; + } + .zt-ls1 { color: #000; font-size: 16px; @@ -1549,6 +1615,10 @@ border-radius: 1.5em; margin-bottom: 1em; position: relative; + p{ + font-size: 12px; + line-height: 20px; + } } div.bk1 { @@ -1602,9 +1672,29 @@ background: #E2F4FE; border: 2px solid #3EC9F4; padding: 20px 10px; - margin-top: 2em; + margin-top: 1em; margin-bottom: 1em; position: relative; + } + + .bk2::after { + content: ''; + position: absolute; + right: -2px; + bottom: -2px; + width: 0; + height: 0; + border-bottom: 20px solid #fff; + /* 涓夎褰㈢殑鍙宠竟妗� */ + border-left: 20px solid #3EC9F4; + /* 涓夎褰㈢殑搴曡竟妗� */ + border-right: 0px solid #fff; + /* 涓夎褰㈢殑宸﹁竟妗� */ + display: block; + } + + .bk2.show-after::after { + display: none; } .zysx { @@ -1644,32 +1734,80 @@ color: #6F84AF; font-weight: bold; font-size: 1.1em; + } + .bj1 { + background-color: rgb(204, 236, 251); + padding: 0.2em 0.5em 0.2em 0.5em; + border-radius: 1em; + margin-bottom: 2em; + margin-left: 0.6em; + box-shadow: 0 0 30px rgba(135 209 243); + } + + .title { + width: 260px; + height: 50px; + text-align: center; + margin: 0 auto; + padding-top: 5%; + position: relative; } div.bj2 { - background-color: #9ADBF9; - padding: 0.1px 0.5px 0.1px 0.5px; + position: absolute; + width: 260px; + height: 45px; + background-color: #9adbf9; border-radius: 1.5em; - margin-bottom: 0.2em; - margin-left: -0.6em; - margin-right: -0.7em; - margin-top: -1.4em; - box-shadow: 10px -8px 1px #C7EAFD; - // box-shadow: 5px -8px #C7EAFD; + top: 8px; + mix-blend-mode: multiply; } div.bj3 { - background-color: #C7EAFD; - padding: 28px 10px 6px 10px; + position: absolute; + width: 265px; + height: 45px; + background-color: #9ADBF9; border-radius: 1.5em; - margin-bottom: 3em; - margin-left: 0em; - margin-right: 5em; - margin-top: 0; } + .frontOne { + font-family: "瀹嬩綋"; + color: #fff; + margin: 0 !important; + font-size: 24px; + position: absolute; + width: 260px; + height: 50px; + line-height: 50px; + } + .rw-bg { + width: 90%; + height: 90px; + position: relative; + color: #00B1F5; + margin-bottom: 1em; + } + + .bj4 { + position: absolute; + width: 100%; + height: 85px; + background-color: #C7EAFD; + border-radius: 1em; + } + + .bj5 { + position: absolute; + width: 98.5%; + height: 85px; + background-color: #C7EAFD; + border-radius: 1em; + top: 10px; + mix-blend-mode: multiply; + } span.bj3-xyx { background-color: #92B03E; @@ -1688,7 +1826,9 @@ } - + .f-kai{ + font-family: "kaiti"; + } .ts-1 { @@ -1705,66 +1845,6 @@ padding: 0.2em 0; text-indent: 0em; margin-left: 0%; - } - - .bj4 { - background-color: #D7E2F0; - padding: 10px 20px; - border-radius: 0.1em; - margin-bottom: 1em; - margin-top: 1em; - - } - - div.bj4-xyx { - font-size: 18px; - color: #fff; - line-height: 20px; - padding: 12.5px 15px 12.5px 15px; - margin-right: 10px; - background-color: #5192C6; - border-radius: 5px; - } - - .bj4-xyx-pd { - font-size: 16px; - color: #fff; - line-height: 20px; - padding: 22px 10px 22px 10px; - background-color: #5192C6; - margin-right: 10px; - border-radius: 5px; - flex-wrap: nowrap; - } - - .bj4-xyx-icon { - color: #5192C6; - text-wrap: nowrap; - } - - .bj5 { - background-color: #CEC9DA; - padding: 20px; - border-radius: 0.5em; - margin-bottom: 1.5em; - margin-top: 1.5em; - position: relative; - } - - span.bj5-xyx { - background-color: #7C719E; - color: #FFFFFF; - border-radius: 1.5em; - padding: 5px 20px 5px 20px; - font-size: 1em; - font-weight: bold; - - } - - div.bj5-xyx { - position: absolute; - top: -20px; - } .bj6 { @@ -1832,9 +1912,9 @@ .rwmb-1 { margin-left: -2.6em; - margin-bottom: 0.2em; - margin-top: 0.5em; - height: 3.5em; + margin-bottom: 0.5em; + margin-top: 1em; + height: 4em; } .rwmb-2 { @@ -1846,14 +1926,14 @@ .rwmb-3 { position: absolute; - top: -15px; + top: -11px; left: 5px; margin-bottom: 15px; } .rwmb-4 { position: absolute; - top: -10px; + top: -7px; left: 20px; margin-bottom: 15px; } -- Gitblit v1.9.1