模板代码改动
阅读页标题大小改动 Story > post.php
befor:
<h1 class="post-title" itemprop="name headline"><?php $this->title() ?></h1>
<div class="post-meta">
<p>Written by <a itemprop="name" href="<?php $this->author->permalink(); ?>" rel="author"><?php $this->author(); ?></a> with ♥ on <time datetime="<?php $this->date('c'); ?>" itemprop="datePublished"><?php $this->date('F j, Y'); ?></time> in <?php $this->category(', ', true, 'none'); ?></p>
</div>
after:
<h2 class="post-title" itemprop="name headline"><?php $this->title() ?></h2>
<div class="post-meta">
<p>Written by <a itemprop="name" href="<?php $this->author->permalink(); ?>" rel="author"><?php $this->author(); ?></a> on <time datetime="<?php $this->date('c'); ?>" itemprop="datePublished"><?php $this->date('F j, Y'); ?></time> in <?php $this->category(', ', true, 'none'); ?></p>
</div>
标题太大了,所以改小一号并去掉了with ♥
。根据个人喜好吧,其实屏幕大了还是h1
好看~
CSS 改动
YouTube 自适应 Story > assert > css > main.css
add:
h6 {
position: relative;
width: 100%;
height: 0;
padding-bottom: 56.25%;
}
.video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
参考文章:How To Make a Responsive 100% Width YouTube iFrame Embed
演示视频
提示:视频也许看不到,毕竟这个是 YouTube 内容!
因为MarkDown
语法问题,不知道如何解析div
标签,所以废掉了不常用的h6
标签,凑合用吧~