Skip to content

石磊 / cihai

Go to a project
Commit c7e364d0 by 孙少雄
Options

修改前端DOM结构

1 parent 9f9c81bf
Inline Side-by-side
Showing 2 changed files with 144 additions and 142 deletions
serverside/cihai-pc/src/main/webapp/WEB-INF/jsp/word/character_baike.jsp
...@@ -65,7 +65,7 @@ ...@@ -65,7 +65,7 @@
<div class="album"> <div class="album">
<div class="pic" style="background-image:url(${vo.images.get(0).file})"></div> <div class="pic" style="background-image:url(${vo.images.get(0).file})"></div>
</div> </div>
<div class="sub-tip">${vo.word}图册（5）</div> <!-- <div class="sub-tip">${vo.word}图册（5）</div> -->
</div> </div>
</c:if> </c:if>
</div> </div>
......
serverside/cihai-pc/src/main/webapp/WEB-INF/jsp/word/character_paraph.jsp
...@@ -63,172 +63,174 @@ ...@@ -63,172 +63,174 @@
</div> </div>
</div> </div>
<div class="content"> <div class="content">
<div class="row"> <div class="container">
<div class="col-xs-17"> <div class="row">
<ul class="tab-nav"> <div class="col-xs-17">
<li class="tab-nav-item active"> <ul class="tab-nav">
<a href="javascript:;">语词</a> <li class="tab-nav-item active">
</li> <a href="javascript:;">语词</a>
<c:if test="${hasBaike}">
<li class="tab-nav-item">
<a href="/word/character/baike/${vo.wordId}">百科</a>
</li> </li>
</c:if> <c:if test="${hasBaike}">
</ul> <li class="tab-nav-item">
<a href="/word/character/baike/${vo.wordId}">百科</a>
</li>
</c:if>
</ul>
</div>
</div> </div>
</div> <div class="row">
<div class="row"> <div class="col-xs-17">
<div class="col-xs-17"> <main class="main">
<main class="main"> <div class="main__hd">
<div class="main__hd"> <div class="character">
<div class="character"> <div class="clearfix">
<div class="clearfix"> <div class="character__hd">
<div class="character__hd"> <div class="character-huge">${vo.word}</div>
<div class="character-huge">${vo.word}</div> <div class="character-cells">
<div class="character-cells"> <div class="character-cell js-origin">字源</div>
<div class="character-cell js-origin">字源</div> <div class="character-cell js-calligraphy">书法</div>
<div class="character-cell js-calligraphy">书法</div>
</div>
</div>
<div class="character__bd">
<div class="character-spell">
<c:forEach items="${vo.spell}" var="item">
【${item}】
</c:forEach>
<div class="character-voice">
<div class="icon icon-voice"></div>
</div> </div>
</div> </div>
<div class="character-info clearfix"> <div class="character__bd">
<c:forEach items="<%=HtmlHelper.paraphBriefToHtml(vo.getBrief())%>" var="item"> <div class="character-spell">
${item} <c:forEach items="${vo.spell}" var="item">
</c:forEach> 【${item}】
</c:forEach>
<div class="character-voice">
<div class="icon icon-voice"></div>
</div>
</div>
<div class="character-info clearfix">
<c:forEach items="<%=HtmlHelper.paraphBriefToHtml(vo.getBrief())%>" var="item">
${item}
</c:forEach>
</div>
</div> </div>
</div> </div>
</div> <div class="collapse" id="collapse">
<div class="collapse" id="collapse"> <div class="character-origin clearfix">
<div class="character-origin clearfix"> <div class="character-origin-item">
<div class="character-origin-item"> <div class="character-origin-image">
<div class="character-origin-image"> <img src="/temp/origin1.png">
<img src="/temp/origin1.png"> </div>
<div class="character-origin-desc">甲骨文</div>
</div> </div>
<div class="character-origin-desc">甲骨文</div> <div class="character-origin-item">
</div> <div class="character-origin-image">
<div class="character-origin-item"> <img src="/temp/origin2.png">
<div class="character-origin-image"> </div>
<img src="/temp/origin2.png"> <div class="character-origin-desc">金文</div>
</div> </div>
<div class="character-origin-desc">金文</div> <div class="character-origin-item">
</div> <div class="character-origin-image">
<div class="character-origin-item"> <img src="/temp/origin3.png">
<div class="character-origin-image"> </div>
<img src="/temp/origin3.png"> <div class="character-origin-desc">小篆</div>
</div> </div>
<div class="character-origin-desc">小篆</div> <div class="character-origin-item">
</div> <div class="character-origin-image">
<div class="character-origin-item"> <img src="/temp/origin4.png">
<div class="character-origin-image"> </div>
<img src="/temp/origin4.png"> <div class="character-origin-desc">康熙字</div>
</div> </div>
<div class="character-origin-desc">康熙字</div> <div class="character-origin-item">
</div> <div class="character-origin-image">
<div class="character-origin-item"> <img src="/temp/origin5.png">
<div class="character-origin-image"> </div>
<img src="/temp/origin5.png"> <div class="character-origin-desc">楷体</div>
</div> </div>
<div class="character-origin-desc">楷体</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <div class="main__bd">
<div class="main__bd"> <ul class="main-tab js-tab clearfix">
<ul class="main-tab js-tab clearfix"> <li class="main-tab-item active">
<li class="main-tab-item active"> <a href="#tab1">释义</a>
<a href="#tab1">释义</a> </li>
</li> <li class="main-tab-item">
<li class="main-tab-item"> <a href="#tab2">精简释义</a>
<a href="#tab2">精简释义</a> </li>
</li> </ul>
</ul> <div class="tab-content">
<div class="tab-content"> <div class="tab-pane active paraphrase" id="tab1">
<div class="tab-pane active paraphrase" id="tab1"> <article class="paraphrase-article">
<article class="paraphrase-article"> <c:forEach items="${vo.body}" var="item" varStatus="status">
<c:forEach items="${vo.body}" var="item" varStatus="status"> <section class="paraphrase-section js-sec">
<section class="paraphrase-section js-sec"> <div class="paraphrase-title">
<div class="paraphrase-title"> <span class="paraphrase-num">${status.index+1}.</span>${item.main}
<span class="paraphrase-num">${status.index+1}.</span>${item.main} </div>
</div> <c:forEach items="${item.description}" var="d">
<c:forEach items="${item.description}" var="d"> <p class="paraphrase-p">${d}</p>
<p class="paraphrase-p">${d}</p>
</c:forEach>
<a class="paraphrase-btn js-copy" href="#">复制</a>
</section>
</c:forEach>
</article>
</div>
<div class="tab-pane paraphrase-simple" id="tab2">
<div class="paraphrase-simple-cells">
<div class="row">
<c:forEach items="<%=Lists.partition(vo.getBody(), 5)%>" var="group" varStatus="gStatus">
<div class="col-xs-12">
<c:forEach items="${group}" var="item" varStatus="iStatus">
<div class="paraphrase-simple-cell">
<div class="paraphrase-num">${gStatus.index*5+iStatus.index+1}.</div>
<div class="paraphrase-title">${item.main}</div>
</div>
</c:forEach> </c:forEach>
</div> <a class="paraphrase-btn js-copy" href="#">复制</a>
</section>
</c:forEach> </c:forEach>
</article>
</div>
<div class="tab-pane paraphrase-simple" id="tab2">
<div class="paraphrase-simple-cells">
<div class="row">
<c:forEach items="<%=Lists.partition(vo.getBody(), 5)%>" var="group" varStatus="gStatus">
<div class="col-xs-12">
<c:forEach items="${group}" var="item" varStatus="iStatus">
<div class="paraphrase-simple-cell">
<div class="paraphrase-num">${gStatus.index*5+iStatus.index+1}.</div>
<div class="paraphrase-title">${item.main}</div>
</div>
</c:forEach>
</div>
</c:forEach>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <div class="js-top"></div>
<div class="js-top"></div> </main>
</main> </div>
</div> <div class="col-xs-7">
<div class="col-xs-7"> <aside class="aside">
<aside class="aside"> <div class="statistics">
<div class="statistics"> <div class="statistics-title title-base">词条统计</div>
<div class="statistics-title title-base">词条统计</div> <div class="statistics-content">
<div class="statistics-content"> <div class="statistics-p">
<div class="statistics-p"> <span class="statistics-label">主 编：</span>
<span class="statistics-label">主 编：</span> <span class="statistics-value">${edition.mainEditor}</span>
<span class="statistics-value">${edition.mainEditor}</span> </div>
</div> <div class="statistics-p">
<div class="statistics-p"> <span class="statistics-label">修订者：</span>
<span class="statistics-label">修订者：</span> <span class="statistics-value">${edition.reviser}</span>
<span class="statistics-value">${edition.reviser}</span> </div>
</div> <div class="statistics-p">
<div class="statistics-p"> <span class="statistics-label">修订记录： </span>
<span class="statistics-label">修订记录： </span> <span class="statistics-value">
<span class="statistics-value"> <span class="text-lg">${edition.reviseCount}</span>次</span>
<span class="text-lg">${edition.reviseCount}</span>次</span> <a class="statistics-link" href="#">历史版本</a>
<a class="statistics-link" href="#">历史版本</a> </div>
</div> <div class="statistics-p">
<div class="statistics-p"> <span class="statistics-label">浏览次数： </span>
<span class="statistics-label">浏览次数： </span> <span class="statistics-value">
<span class="statistics-value"> <span class="text-lg"><fmt:formatNumber value="${edition.viewCount}" type="number"/></span> 次</span>
<span class="text-lg"><fmt:formatNumber value="${edition.viewCount}" type="number"/></span> 次</span> </div>
</div> </div>
</div> </div>
</div> <c:if test="${relateWords.size()>0}">
<c:if test="${relateWords.size()>0}"> <div class="recommend">
<div class="recommend"> <div class="recommend-title title-base">推荐词</div>
<div class="recommend-title title-base">推荐词</div> <div class="recommend-section">
<div class="recommend-section"> <div class="recommend-section-title title-sm title-primary">${vo.word}</div>
<div class="recommend-section-title title-sm title-primary">${vo.word}</div> <div class="recommend-cells">
<div class="recommend-cells"> <c:forEach items="${relateWords}" var="item">
<c:forEach items="${relateWords}" var="item"> <span class="recommend-cell">${item.word}</span>
<span class="recommend-cell">${item.word}</span> </c:forEach>
</c:forEach> </div>
</div> </div>
</div> </div>
</div> </c:if>
</c:if> <div class="aside-tag text-primary">标签：语词</div>
<div class="aside-tag text-primary">标签：语词</div> </aside>
</aside> </div>
</div> </div>
</div> </div>
</div> </div>
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!