Das Thumbnail-Seitenverhältnis-Problem

Ich habe ein Thumbnail wie dieses in meinem WordPress Theme One Template → verwendet

 

Im Browser wird so gerendert →

  

Meine erste Frage ist, wie man height = auto setzt, gibt es irgendeine function, die uns dabei helfen kann? wie zum Beispiel responsive-img

Kurz gesagt, ich frage, ob ich die Breite über das CSS kontrollieren möchte oder WordPress eine function dafür bietet?

Solutions Collecting From Web of "Das Thumbnail-Seitenverhältnis-Problem"

Wenn Sie den Wert für die Höhe von Ihrer URL img entfernen möchten, können Sie diese function verwenden:

 add_filter( 'post_thumbnail_html', 'remove_thumbnail_height', 10, 5 ); function remove_thumbnail_height( $html, $post_id, $post_thumbnail_id, $size, $attr ) { $html = preg_replace( '/height=\"\d*\"/', "", $html ); return $html; } 

Dadurch wird die Höhe durch einen leeren Wert ersetzt. Beachten Sie, dass Sie Auto als Wert für die Eigenschaft height . Es wird nicht vom W3-Validator validiert. Sie können die Höhe jedoch in Ihrem CSS auf “Automatisch” setzen:

 .wp-post-image { height: auto; } 

Sie können so etwas verwenden,

  $image_thumb = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID),'thumbnail'); $image_medium = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID),'medium'); $image_large = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID),'large');  1240w, < ?php echo $image_medium[0];?> 620w, < ?php echo $image_small[0];?> 310w" sizes="(min-width: 41.25em) 41.25em, 100vw" />; 

Wenn Sie kein Bootstrap-Framework verwenden, legen Sie das Stylesheet fest

 .img-responsive{ width: 100%; }