为了保持本站整体风格的统一性，方便各位书友快捷的发布排版展示，故在此说明。下面所涉及到的代码请在编辑器的文本模式下输入。
一、表格形式图片预览代码
代码如下：[s][p]
- <table style="text-align: center; border: #fff;" border="1" width="600" cellspacing="1" cellpadding="1">
- <tbody>
- <tr>
- <td style="text-align: center; border: #fff;"><a href="图片链接1"><img class="aligncenter" src="图片链接1" width="190" height="340" alt="图片说明1"/></a></td>
- <td style="text-align: center; border: #fff;"><a href="图片链接2"><img class="aligncenter" src="图片链接2" width="190" height="340" alt="图片说明2"/></a></td>
- <td style="text-align: center; border: #fff;"><a href="图片链接3"><img class="aligncenter" src="图片链接3" width="190" height="340" alt="图片说明3"/></a></td>
- </tr>
- </tbody>
- </table>
[/p]
预览：
 |
 |
 |
请替换代码中的图片链接、图片说明等文字，如果加入更多图片请根据情况增加表格行，并调整图片宽度或者使用下面的相册模式。
二、文章中插入相册展示
代码如下：[s][p]
- <div style="width: 400px; margin-left: 180px;">【img】<a href="图片链接1"><img class="aligncenter" src="图片链接1" alt="图片说明1" width="190" height="340" /></a><a href="图片链接2"><img class="aligncenter" src="图片链接2" alt="图片说明2" width="190" height="340" /></a><a href="图片链接3"><img class="aligncenter" src="图片链接3" alt="图片说明3" width="190" height="340" /></a>【/img】</div>
[/p]
请替换【】为[]
演示：
[img][/img]
[/img]在【img】和【img】标签中每个图片之间不能有空格等其他元素，否则无法识别图片。
知更鸟begin主题文章中放入哔哩哔哩视频自适应页面大小代码
将以下代码加入到style.css文件末尾，或者在主题设置-自定义风格里添加：
[s][p]
- .smartideo { z-index: 0; text-align: center; background: #CCC; line-height: 0; text-indent: 0; }
- .smartideo embed, .smartideo iframe { padding: 0; margin: 0; }
- .smartideo .player { width: 100%; height: 500px; overflow: hidden; position: relative; }
- .smartideo .player a.smartideo-play-link { display: block; width: 50px; height: 50px; text-decoration: none; border: 0; position: absolute; left: 50%; top: 50%; margin: -25px; }
- .smartideo .player a.smartideo-play-link p { display: none; }
- .smartideo .player .smartideo-play-button { width: 0; height: 0; border-top: 25px solid transparent; border-left: 50px solid #FFF; border-bottom: 25px solid transparent; }
- .smartideo .tips { background: #f2f2f2; text-align: center; max-height: 32px; line-height: 32px; font-size: 12px; }
- .smartideo .tips a { text-decoration: none; }
- @media screen and (max-width:959px){
- .smartideo .player { height: 450px; }
- }
- @media screen and (max-width:767px){
- .smartideo .player { height: 400px; }
- }
- @media screen and (max-width:639px){
- .smartideo .player { height: 350px; }
- }
- @media screen and (max-width:479px){
- .smartideo .player { height: 250px; }
- }
[/p]
发视频代码：
[s][p]
- <div class="smartideo">
- <div class="player"><iframe src="//player.bilibili.com/player.html?aid=53452583&cid=93503857&page=1" width="100%" height="100%" frameborder="no" scrolling="no" allowfullscreen="allowfullscreen"> </iframe></div>
- </div>
[/p]
如果是其他主题，安装smartideo插件，也是一样的，将css引入主题，发帖代码一样即可。
更新：通用代码：
- <iframe id="spkj" src="https://player.bilibili.com/player.html?aid=视频AV号amp;page=1" width="100%" frameborder="no" scrolling="no" allowfullscreen="allowfullscreen"><span data-mce-type="bookmark" style="display: inline-block; width: 0px; overflow: hidden; line-height: 0;" class="mce_SELRES_start"></span> </iframe>
- <script type="text/javascript">
- document.getElementById("spkj").style.height=document.getElementById("spkj").scrollWidth*0.76+"px";
- </script>
视频代码：
- <figure class="wp-block-video"><video controls="" poster="https://cs.vmovier.com/Uploads/cover/2019-11-04/5dbfc186708fc_cut.jpeg@600w_400h_1e_1c.jpg" src="https://qiniu-xpc11.vmoviercdn.com/5c36aaa9e1ef7.mp4"></video></figure>
发书样本
[s][p]
- <h4>编辑导语</h4>
- <strong><span style="color: #ff0000;">官场文大神瑞根的最新作品，还是原来的配方，原来的味道，官场文爱好者不要错过。瑞根的《官道无疆》也是我比较喜欢的一本小说。本书也是这次河蟹大潮中起点硕果仅存的唯一一本官场文。</span></strong>
- <a href="https://imgbed.top/images/2019/20191219223515.png"><img class="aligncenter " src="https://imgbed.top/images/2019/20191219223515.png" width="345" height="1103" /></a>
- <h4>内容提要</h4>
- <span style="color: #0000ff;"><strong>当扑面而来的时代巨澜把懵懵懂懂的沙正阳卷入其中时，他是随波逐流，风花雪月，还是长缨在手，逆流击波？ 干想干的事，为恣意人生。 做该做的事，为家国情怀。 一万年太久，只争朝夕！到中流击水，浪遏飞舟！</strong></span>
- <h4>排版欣赏</h4>
- <div style="width: 400px; margin-left: 180px;">[img]<a href="https://imgbed.top/images/2019/20191219223918.png "><img class="aligncenter" src="https://imgbed.top/images/2019/20191219223918.png " alt="内容简介" width="190" height="340" /></a><a href="https://imgbed.top/images/2019/20191219224017.png "><img class="aligncenter" src="https://imgbed.top/images/2019/20191219224017.png " alt="制作说明" width="190" height="340" /></a><a href="https://imgbed.top/images/2019/20191219224048.png "><img class="aligncenter" src="https://imgbed.top/images/2019/20191219224048.png " alt="分卷页" width="190" height="340" /></a><a href="https://imgbed.top/images/2019/20191219224200.png "><img class="aligncenter" src="https://imgbed.top/images/2019/20191219224200.png " alt="章节页" width="190" height="340" /></a>[/img]</div>
- <h4>制作说明</h4>
- <blockquote><span style="color: #008080;">本书以网友提供的精校文本为底本，进行封面设计、排版制作而成。在此对制作过程中进行指导的友人表示感谢。没有他们的参与和帮助，不会有这本书。鞠躬。</span></blockquote>
- <h4>下载试读</h4>
- [button]兰奏云下载[/button]
[/p]
评论