如何将帖子标题右移到首页上的缩略图

时间:2016-11-06 15:40:35

标签: css wordpress

将帖子标题右移到首页缩略图的css代码是什么?请帮助我的网站 http://www.avjtrickz.com

提前致谢。

3 个答案:

答案 0 :(得分:0)

您可以随时将float: right应用于.post-title,就像我在Chrome检查器中完成的那样:https://www.dropbox.com/s/hj514whsy27h4vr/Screenshot%202016-11-06%2010.55.48.jpg?dl=0

答案 1 :(得分:0)

将CSS的第569行更改为

.post-title, .post-title a {
    color: #1e73be;
    text-align: right;
}

答案 2 :(得分:0)

我在你的缩略图和标题中添加了一个父div,交换了他们的位置(图像优先然后是标题)并添加了一些css



.classyoulike {
display:inline-table;
}
.wp-post-image {
display: table-cell;
min-width: 120px;
}
.post-title {
display:table-cell;
vertical-align:top;
  padding-left: 20px;
}

<div class="post-header">
<div class="classyoulike">
 <img width="120" height="120" src="http://i2.wp.com/www.avjtrickz.com/wp-content/uploads/2016/11/avjtrickz-deals-of-the-day-.jpg.jpg?resize=120%2C120" class="alignleft wp-post-image" alt="avjtrickz-deals-of-the-day-.jpg.jpg" srcset="http://i2.wp.com/www.avjtrickz.com/wp-content/uploads/2016/11/avjtrickz-deals-of-the-day-.jpg.jpg?w=1773 1773w, http://i2.wp.com/www.avjtrickz.com/wp-content/uploads/2016/11/avjtrickz-deals-of-the-day-.jpg.jpg?resize=120%2C120 120w, http://i2.wp.com/www.avjtrickz.com/wp-content/uploads/2016/11/avjtrickz-deals-of-the-day-.jpg.jpg?resize=500%2C500 500w, http://i2.wp.com/www.avjtrickz.com/wp-content/uploads/2016/11/avjtrickz-deals-of-the-day-.jpg.jpg?resize=1024%2C1024 1024w, http://i2.wp.com/www.avjtrickz.com/wp-content/uploads/2016/11/avjtrickz-deals-of-the-day-.jpg.jpg?resize=450%2C450 450w, http://i2.wp.com/www.avjtrickz.com/wp-content/uploads/2016/11/avjtrickz-deals-of-the-day-.jpg.jpg?resize=60%2C60 60w, http://i2.wp.com/www.avjtrickz.com/wp-content/uploads/2016/11/avjtrickz-deals-of-the-day-.jpg.jpg?resize=45%2C45 45w, http://i2.wp.com/www.avjtrickz.com/wp-content/uploads/2016/11/avjtrickz-deals-of-the-day-.jpg.jpg?resize=800%2C800 800w, http://i2.wp.com/www.avjtrickz.com/wp-content/uploads/2016/11/avjtrickz-deals-of-the-day-.jpg.jpg?resize=600%2C600 600w" sizes="(max-width: 120px) 100vw, 120px" data-wp-pid="1733" >
<h2 class="post-title"><a href="http://www.avjtrickz.com/deals-of-the-dayexclusive-shopping-deals-august-19/" rel="bookmark" title="Ambrane Power Bank P-2000 (20,800mAh ) white at 60% OFF (*November 4*)">Ambrane Power Bank P-2000 (20,800mAh ) white at 60% OFF (*November 4*)</a></h2>
  </div>
  </div>
&#13;
&#13;
&#13;