PHP的基本问题 - 换班

时间:2015-06-17 22:06:24

标签: php css wordpress

我正在使用wordpress网站,我对PHP不是很熟悉。 不知何故,我设法在图像下方生成以下空行:

http://i.imgur.com/PazQgLl.jpg

所以我的问题是如何删除或避免在图像下面留下这个空白区域。

这是该页面的PHP。我认为原因必须在某处。

<?php
/**
 * The template part for displaying the post meta information
 *
 * @package Editor
 */
?>
<div class="entry-meta">
<!-- Grab and display the featured image -->
<?php if ( '' != get_the_post_thumbnail()) {?>
<a class="frontfeatured-image" href="<?php the_permalink()?>">
<?php the_post_thumbnail('thumbnail-image')?>
</a>
<?php }?>

<!--
    <ul class="meta-list">
        <?php if ( has_category() ) { ?>
            <li class="meta-cat"><?php the_category( ', ' ); ?></li>
        <?php } ?>
        <?php $posttags = get_the_tags(); if ( $posttags ) { ?>
            <li class="meta-tag"><?php the_tags( '' ); ?></li>
        <?php } ?>
        <?php if ( ! post_password_required() && ( comments_open() || '0' != get_comments_number() ) ) : ?>
        <li class="meta-comment">
            <span class="comments-link"><?php comments_popup_link( __( 'Leave a comment', 'editor' ), __( '1 Comment', 'editor' ), __( '% Comments', 'editor' ) ); ?></span>
        </li>
        <?php endif; ?>
    </ul>
-->
</div>

CSS:

.entry-meta {
  display: inline-block;
  width: 40%;
  margin-right: 10px;
  vertical-align: top;
  border-width: 10px;
  border-color: #000000;
  border-style: solid;
}
@media (max-width: 768px) {
  .entry-meta {
    margin-bottom: 0%;
    width: 100%;
  }
}

.frontfeatured-image {
  display: inherit;
  border-style: solid;
  border-color: #000000;
  border-width: 0px;  
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  width: 100%;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    -moz-transition:-moz-transform 0.5s ease-in; 
    -webkit-transition:-webkit-transform 0.5s ease-in; 
    -o-transition:-o-transform 0.5s ease-in;
    -moz-transition:-moz-transform 0.5s ease-out; 
    -webkit-transition:-webkit-transform 0.5s ease-out; 
    -o-transition:-o-transform 0.5s ease-out;
    }
    .frontfeatured-image:hover{
    -moz-transform:scale(1.02); 
    -webkit-transform:scale(1.02);
    -o-transform:scale(1.02);
    color: #000000;
  }

2 个答案:

答案 0 :(得分:0)

在图片上应用以下样式会发生什么?

.frontfeatured-image img{
  display: inline-block;
}

答案 1 :(得分:0)

试试这个

&#13;
&#13;
.frontfeatured-image img{
  float: left;
}
&#13;
&#13;
&#13;