Question

我有一个图像类.awpcp-listing-excerpt-thumbnail，我正在尝试对其应用边框半径。但是它不会响应选择器。

这是我编写的代码：

.awpcp-listing-excerpt-thumbnail {
  border-radius: 10px;
}

<div class="awpcp-listing- 
    excerpt $awpcpdisplayaditems 
    $isfeaturedclass" data- breakpoints-class- prefix="awpcp-listing-excerpt" data-breakpoints='{"tiny": 
    [0,328], "small": [328,600], 
    "medium": [600,999999]}'>
  <div class="awpcp-listing- 
    excerpt-thumbnail">
    $awpcp_image_name_srccode
  </div>
  <div class="awpcp-listing- 
    excerpt-inner" style="w">
    <h4 class="awpcp-listing- 
    title">$title_link</h4>
    <div class="awpcp-listing- 
    excerpt-content">$excerpt</div>
  </div>
  <div class="awpcp-listing- 
    excerpt-extra">
    $awpcp_city_display $awpcp_state_display $awpcp_display_adviews $awpcp_display_price $awpcpextrafields
  </div>
  </div>

Answer 1

您可以更改CSS以选择clc; clear; close all; %% hx = [-1/sqrt(5);-2/sqrt(5)]; hu = [0;0]; N = 5; E1 = ones(N+1,1); E2 = zeros(N,1); Krx = kron(E1,hx); Kru = kron(E2,hu); for k = 0:N if k == 0 h(k) = [Krx;Kru]; else h(k) = [Kru;Kru]; end end元素：img，也可以将.awpcp-listing-excerpt-thumbnail img{添加到现有的CSS样式中。

还有overflow:hidden，因此display:inline-block将具有图像的宽度，而不是div.awpcp-listing-excerpt-thumbnail的宽度（默认情况下会发生，因为div是100%元素）

block

.awpcp-listing-excerpt-thumbnail{
    border-radius: 10px;
    overflow: hidden;
    display: inline-block;
    line-height:0;
}

如果图像不是唯一的孩子，请使用

<div class="awpcp-listing-excerpt-thumbnail">
<img src="https://via.placeholder.com/150">
</div>

.awpcp-listing-excerpt-thumbnail img{
    border-radius: 10px;
}

Answer 2

更改CSS

.awpcp-listing-excerpt-thumbnail img{ 
  border-radius: 10px;
}

如何创建具有边框半径的图像？

2 个答案: