From f77e02b69e4512f00251929b14888f3e6bbac37f Mon Sep 17 00:00:00 2001 From: zhongshujie <2862698242@qq.com> Date: 星期一, 09 九月 2024 10:41:19 +0800 Subject: [PATCH] 艺术戏剧(bug解决) --- src/books/artAndDrama/view/components/chapter002.vue | 44 ++++++++++++++++++++++---------------------- 1 files changed, 22 insertions(+), 22 deletions(-) diff --git a/src/books/artAndDrama/view/components/chapter002.vue b/src/books/artAndDrama/view/components/chapter002.vue index f982cfe..fd20564 100644 --- a/src/books/artAndDrama/view/components/chapter002.vue +++ b/src/books/artAndDrama/view/components/chapter002.vue @@ -4,7 +4,7 @@ <div v-if="showPageList.indexOf(14) > -1"> <h1 id="a004"> <img class="img-0" alt="" src="../../assets/images/dy2.jpg" /> - <audio :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio"></audio> + <audio style="margin-top: 1em;" :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio"></audio> </h1> <div class="bodystyle"> <div class="bk"> @@ -37,12 +37,12 @@ <h3 class="lefth3" id="c011"> <img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" /> </h3> - <p class="text"><span class="hs1">鈼�</span>鎴戞槸灏忕敾瀹�</p> + <p class="text rhombusFather"><span class="hs1 rhombus">鈼�</span>鎴戞槸灏忕敾瀹�</p> <p class="text">淇濇寔澶撮儴涓嶅姩锛岃瘯鐫�鐢ㄧ溂绁炵敾鍑轰笅闈㈢殑鍥炬鍚э紒</p> <p class="center openImgBox"> <img class="img-e" alt="" src="../../assets/images/0016-1.jpg" /> </p> - <p class="text"><span class="hs1">鈼�</span>鍡呰澶у啋闄�</p> + <p class="text rhombusFather"><span class="hs1 rhombus">鈼�</span>鍡呰澶у啋闄�</p> <p class="text"> 浣犳渶鐖卞悆鐨勯鐗╂槸 <input v-model="questionData.warnUp.one" class="input-bottom-border fz-18" @change="setBookQuestion" style="width: 13%" />銆傚綋闂诲埌瀹冪殑鍛抽亾鏃讹紝浣犱細鍋氬嚭浠�涔堣〃鎯呭憿锛� @@ -55,8 +55,8 @@ <img class="img-gn1" alt="" src="../../assets/images/czysj.jpg" /> </h3> <div style="display: flex; justify-content: flex-start;"> - <p class="text" style="width: 50%"> - <span class="hs1">鈼�</span>浠ュ皬缁勪负鍗曚綅锛屼娇鐢ㄦ墜鍋堕亾鍏疯〃婕旈檮褰曚腑鐨勫墽鏈�夋2銆� + <p class="text rhombusFather" style="width: 50%"> + <span class="hs1 rhombus">鈼�</span>浠ュ皬缁勪负鍗曚綅锛屼娇鐢ㄦ墜鍋堕亾鍏疯〃婕旈檮褰曚腑鐨勫墽鏈�夋2銆� </p> <p class="openImgBox" style="width: 50%"> <img class="img-e" alt="" src="../../assets/images/2-1.gif" /> @@ -78,7 +78,7 @@ <div class="bodystyle" style="margin-top: 3%;"> <h2 id="b007" class="problem">绗簩璇俱��鏄庡療绉嬫</h2> <h3 class="lefth3" id="c013"><img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" /></h3> - <p class="text"><span class="hs1">鈼�</span>鎴戜滑鐨勪笘鐣屼簲褰╂枒鏂撱�傝浣犲~涓�濉紝鎻愬埌杩欎簺棰滆壊锛屼綘鎯冲埌浜嗗摢浜涗簨鐗╋紵</p> + <p class="text rhombusFather"><span class="hs1 rhombus">鈼�</span>鎴戜滑鐨勪笘鐣屼簲褰╂枒鏂撱�傝浣犲~涓�濉紝鎻愬埌杩欎簺棰滆壊锛屼綘鎯冲埌浜嗗摢浜涗簨鐗╋紵</p> <p class="text">榛勮壊锛氭煚妾��<input v-model="questionData.warnUp.three" class="input-bottom-border fz-18" @change="setBookQuestion" style="width: 70%" /></p> <p class="text">绾㈣壊锛氶灜鐐��<input v-model="questionData.warnUp.four" class="input-bottom-border fz-18" @@ -113,19 +113,19 @@ <h2 id="b008" class="problem">绗笁璇俱��闂诲0璇嗕汉</h2> <h3 class="lefth3" id="c015"><img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" /></h3> <p class="text">甯歌█閬擄細鑹█涓�鍙ヤ笁鍐殩锛屾伓璇激浜哄叚鏈堝瘨銆傝瑷�鍦ㄤ汉涓庝汉鐨勪氦寰�涓捣鐫�閲嶈鐨勪綔鐢紝鏈夌潃鏃犵┓鐨勫姏閲忋��</p> - <p class="text t-l" ><span class="hs1">鈼�</span>濡傛灉鏈嬪弸蹇冩儏涓嶅ソ锛屼綘璇ユ�庝箞瀹夋叞浠�/濂瑰憿锛� + <p class="text t-l rhombusFather" ><span class="hs1 rhombus">鈼�</span>濡傛灉鏈嬪弸蹇冩儏涓嶅ソ锛屼綘璇ユ�庝箞瀹夋叞浠�/濂瑰憿锛� <textarea v-model="questionData.reading.one" placeholder="璇疯緭鍏ュ唴瀹�" rows="6" style="margin-left: 40px; width: 92%" class="" @change="setBookQuestion" :class="{ 'textarea-focused': isFocused === 'one' }" @focus="handleFocus('one')" @blur="handleBlur('one')" ></textarea> </p> - <p class="text t-l"><span class="hs1">鈼�</span>濡傛灉浣犻個璇峰ソ鏈嬪弸鏉ュ閲屽仛瀹紝浣犺璇翠粈涔堟潵娆㈣繋浠�/濂瑰憿锛� + <p class="text t-l rhombusFather"><span class="hs1 rhombus">鈼�</span>濡傛灉浣犻個璇峰ソ鏈嬪弸鏉ュ閲屽仛瀹紝浣犺璇翠粈涔堟潵娆㈣繋浠�/濂瑰憿锛� <textarea v-model="questionData.reading.two" placeholder="璇疯緭鍏ュ唴瀹�" rows="6" style="margin-left: 40px; width: 92%" class="" @change="setBookQuestion" :class="{ 'textarea-focused': isFocused === 'two' }" @focus="handleFocus('two')" @blur="handleBlur('two')" ></textarea> </p> <h3 class="lefth3" id="c016" style="margin-top: 7%;"><img class="img-gn1" alt="" src="../../assets/images/czysj.jpg" /></h3> - <p class="text"><span class="hs1">鈼�</span>璇锋牴鎹彁绀鸿鍑哄彞瀛愶紝娉ㄦ剰澹伴煶鍜岃姘旂殑鍙樺寲銆�</p> + <p class="text rhombusFather"><span class="hs1 rhombus">鈼�</span>璇锋牴鎹彁绀鸿鍑哄彞瀛愶紝娉ㄦ剰澹伴煶鍜岃姘旂殑鍙樺寲銆�</p> <p class="text"><span class="hs">杩欎竴澶у潡濂堕叒閮芥槸鎴戠殑浜嗭紒</span>锛堜竴鍙嫛鐚剧殑铓傝殎锛屾兂瑕佹妸濂堕叒鍋峰伔鍦板崰涓哄繁鏈夛級</p> <p class="text"><span class="hs">杩欎竴澶у潡濂堕叒閮芥槸鎴戠殑浜嗭紒</span>锛堜竴鍙杽鑹殑铓傝殎锛屽湪甯姪浠栦汉鍚庡緱鍒颁簡濂栧姳锛�</p> <p class="text"><span class="hs">杩欏潡濂堕叒澶矇浜嗭紝鎴戜滑浼戞伅涓�涓嬪惂锛�</span>锛堜弗鑲冪殑铓傝殎闃熼暱锛屽悜闃熶紞鍙戝嚭鍛戒护锛�</p> @@ -163,8 +163,8 @@ <h2 id="b009" class="problem">绗洓璇俱��鐪熷惉鐪熺湅鐪熸劅鍙�</h2> <h3 class="lefth3" id="c017"><img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" /></h3> <p class="text">寰呬汉鎺ョ墿鏈夌ぜ鏈夎妭銆佽唉鍗戞伃鏁紝鍦ㄨ浠栦汉鎰熷埌濡傛矏鏄ラ鐨勫悓鏃讹紝涔熶細璁╄嚜宸卞彈鍒颁粬浜虹殑灏婇噸鍜岀悊瑙c�傝璇翠竴璇达紝鍦ㄤ笅闈㈣繖浜涘満鏅腑浣犲簲璇ュ浣曞仛锛�</p> - <p class="text"><span class="hs1">鈼�</span>浣犵湅鍒板濡堢殑姘存澂娌℃按浜嗐��</p> - <p class="text"><span class="hs1">鈼�</span>鐢垫閲岋紝浣犵珯鍦ㄦ渶鍓嶆帓锛屽悗闈㈢殑浜洪渶瑕佷笅鐢垫銆�</p> + <p class="text rhombusFather"><span class="hs1 rhombus">鈼�</span>浣犵湅鍒板濡堢殑姘存澂娌℃按浜嗐��</p> + <p class="text rhombusFather"><span class="hs1 rhombus">鈼�</span>鐢垫閲岋紝浣犵珯鍦ㄦ渶鍓嶆帓锛屽悗闈㈢殑浜洪渶瑕佷笅鐢垫銆�</p> <h3 class="lefth3" id="c018" style="margin-top: 7%;"><img class="img-gn1" alt="" src="../../assets/images/czysj.jpg" /></h3> <div style="display: flex; justify-content: flex-start; "> @@ -173,7 +173,7 @@ <div class="openImgBox" style="width: 50%"><img class="img-e" alt="" src="../../assets/images/2-4.gif" /> </div> </div> - <p class="text"><span class="hs1">鈼�</span>璇疯瘯鐫�鐢ㄦ棤瀹炵墿琛ㄦ紨鐨勬柟寮忔妸涓嬮潰鐨勬儏鏅〃婕斿嚭鏉ュ惂锛�</p> + <p class="text rhombusFather"><span class="hs1 rhombus">鈼�</span>璇疯瘯鐫�鐢ㄦ棤瀹炵墿琛ㄦ紨鐨勬柟寮忔妸涓嬮潰鐨勬儏鏅〃婕斿嚭鏉ュ惂锛�</p> <p class="center text"><img class="img-0" style="width: 100%; height: auto;" lt="" src="../../assets/images/0020-2.jpg" /></p> </div> @@ -193,22 +193,22 @@ <div class="bodystyle" style="margin-top: 3%"> <h2 id="b010" class="problem">鍗曞厓娲诲姩浠诲姟</h2> <h3 class="lefth3" id="c019"><img class="img-gn1" alt="" src="../../assets/images/xsyty.jpg" /></h3> - <p class="text ends"> - <span><span class="hs1">鈼�</span>鍚圭焊缁冧範</span> + <p class="text ends rhombusFather"> + <span><span class="hs1 rhombuSpecial">鈼�</span>鍚圭焊缁冧範</span> <span> <audio :src="auidoPathTwo" controls controlslist="noplaybackrate nodownload" class="audio"></audio></span> </p> <p class="center text" style="margin: 4% 0"><img class="img-e" alt="" src="../../assets/images/0021-1.jpg" /> </p> <p class="text">鎵句竴寮犵焊宸撅紝灏嗗畠鎸夊湪澧欎笂銆傜Щ寮�鍙屾墜锛屽姫鍔涚敤姘旀伅灏嗙焊鈥滈拤鈥濆湪澧欓潰涓婏紝涓嶈璁╁畠鍚戜笅婊戣惤銆�</p> - <p class="text ends"> - <span> <span class="hs1">鈼�</span>鍚圭瑪缁冧範</span> + <p class="text ends rhombusFather"> + <span> <span class="hs1 rhombuSpecial">鈼�</span>鍚圭瑪缁冧範</span> <span> <audio :src="auidoPathThree" controls controlslist="noplaybackrate nodownload" class="audio"></audio></span> </p> <p class="text">灏嗕竴鏀瑪绔嬩簬妗岄潰锛岀湅鐪嬩綘鑳戒笉鑳界敤涓�鍙f皵灏嗗畠鍚瑰�掋��</p> - <p class="text ends"> - <span><span class="hs1">鈼�</span>鍚硅瀛愮粌涔�</span> + <p class="text ends rhombusFather"> + <span><span class="hs1 rhombuSpecial">鈼�</span>鍚硅瀛愮粌涔�</span> <span> <audio :src="auidoPathFour" controls controlslist="noplaybackrate nodownload" class="audio"></audio></span> </p> @@ -228,16 +228,16 @@ </h1> <img class="headerimg" src="../../assets/images/page5.png" alt="" /> <div class="bodystyle" style="margin-top: 3%;"> - <p class="text ends"> - <span> <span class="hs1">鈼�</span>鍚逛箳涔撶悆缁冧範</span> + <p class="text ends rhombusFather"> + <span style="text-wrap: nowrap"> <span class="hs1 rhombuSpecial">鈼�</span>鍚逛箳涔撶悆缁冧範</span> <span> <audio :src="auidoPathFive" controls controlslist="noplaybackrate nodownload" class="audio"></audio></span> </p> <p class="text">鐢ㄦ皵鎭皢妗岄潰涓婄殑涔掍箵鐞冧粠鈥滆捣鐐光�濊繍閫佽嚦鈥滅粓鐐光�濓紝杩愰�佽繃绋嬩腑閬垮厤涔掍箵鐞冭Е纰伴殰纰嶇墿銆�</p> <h3 class="lefth3" id="c020" style="margin-top: 7%"><img class="img-gn1" alt="" src="../../assets/images/tzyys.jpg" /></h3> - <p class="text"> - <span class="hs1">鈼�</span>璇疯蛋杩涘墽鍦鸿鐪嬩笉鍚屽墽绉嶇殑鐜板満婕斿嚭锛屾劅鍙楁垙鍓х殑榄呭姏鍚э紒 + <p class="text rhombusFather"> + <span class="hs1 rhombus">鈼�</span>璇疯蛋杩涘墽鍦鸿鐪嬩笉鍚屽墽绉嶇殑鐜板満婕斿嚭锛屾劅鍙楁垙鍓х殑榄呭姏鍚э紒 </p> <p class="center text"> <video :src="videoPathOne" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true" -- Gitblit v1.9.1