Thumbnail Image Abgerundete Ecken w CSS (oder eine andere gute Methode)

Ich habe erforscht, wie Thumbnails mit abgerundeten Bildern angezeigt werden, aber jede Lösung hat kein Gas mehr.

Ein Trick, den ich ausprobiert habe, war das Wrapping des Thumbnails in eine Division mit der gleichen Größe und Form, die das Bild zeigt, aber mit CSS der opacity:0 so dass das tatsächliche Bild nicht angezeigt wird. Was zeigt, ist das Hintergrundbild für die Teilung, und es ist das, das auch gestylt wird mit:

border-radius: 15px;

(plus andere browserbezogene Hacks)

Um dies auf WordPress zu tun, muss ich Inline-Stile verwenden, um das gleiche Hintergrundbild zu verwenden

 the_post-thumbnail() 

Scheint, ins Nirgendwo zu führen, weil ich keine Möglichkeit sehe, nur die Bild-URL so zu ziehen, dass ich sie anrufen kann

 <div style=" "; 

Irgendwelche Ideen?

Ich versuche, Javascript zu vermeiden, aber wenn das der einzige Weg ist …

Hier ist ein Link zu der Methode, die ich erwähnt habe

Solutions Collecting From Web of "Thumbnail Image Abgerundete Ecken w CSS (oder eine andere gute Methode)"

Sie können die Thumbnail-URL mit wp_get_attachment_image_src und get_post_thumbnail_id abrufen :

 $src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'thumbnail' ); echo $src[0];