php - 特色圖像問題

  显示原文与译文双语对照的内容
0 0

featured圖像的容器寬度和高度沒有顯示。 這是我如何顯示特色圖像


<div id="featuredimage"><?php the_post_thumbnail();?></div>

這是'featuredimage'的CSS'


#featuredimage {
height:200px;
background-color:#000;
margin-left: -40px;
 margin-right: -40px;
 margin-top: -20px;
}

.featuredimage img {
height:200px;
width:600px;
}

這是PHP函數中的代碼


<?php
add_theme_support( 'post-thumbnails' );
?>

怎麼了你可以在這裡看到最後的結果 ? 正如你可以能注意到的,特色圖像採用任何尺寸,但是我希望它是。

时间: 原作者:

0 0

你嘗試使用標識而不是類,e.g.


#featuredimage img {
 height:200px;
 width:600px;
}

然而,你要重複使用 ID,你要重複使用 ID


<div id="featuredimage">

在頁面上多次使用。 應該是唯一的( 請參見 http://www.w3.org/TR/WCAG20-TECHS/H93.html ),因此考慮將它從一個ID改為一個類;


.featuredimage {
 height:200px;
 background-color:#000;
 margin-left: -40px;
 margin-right: -40px;
 margin-top: -20px;
}

.featuredimage img {
 height:200px;
 width:600px;
}

<div class="featuredimage">...</div>

原作者:
0 0

在你的活動頁面中,你正在設置HTML中的寬度和高度,然後嘗試使它成為CSS中的background-image 。 而不是這樣做,只需讓圖像包含在父 div 中。 你的CSS變成:


.featuredimage/* Use a class here so you can use it more than once */
 height:200px;
 background-color:#000;
 margin-left: -40px;
 margin-right: -40px;
 margin-top: -20px;
}

.featuredimage img {
 height:auto;
 width:100%;
}

請確保刪除 background-size 聲明,因為它們與這裡方法( 源代碼中的第 140行) 是不必要的。

原作者:
0 0

你還可以獲取帶有


<?php $feat_image = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );?>
<img src="<?=$feat_image?>" height="100" width="100">

0 0

如果 the_featured_image() 出現了 <img width=...,那麼你可以用一些不會破壞橫橫比的東西來替代它:


<div style="background-image:url(http://MY_IMAGE_URL.png);
 width: 100%; height: 100%;"
 class="attachment-post-thumbnail wp-post-image"></div>

原作者:
...