Question

我是css中的新影，我们可以设置阴影圆形图像（我的意思是圆形图像）。

如果有可能，请在css中给我一个代码。提前谢谢

Answer 1

这是不可能的，因为CSS不知道图像内容的形状（例如，解释透明度）。您可以使用CSS3创建一个圆圈并给出一个阴影see this jsFiddle。

div {
    background: red;
    height: 100px;
    width: 100px;
    border-radius: 50px;
    margin: 20px;
    -webkit-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 1);
    -moz-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 1);
    box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 1);
}

Answer 2

阴影与css中的形状无关，您可以在创建圆后使用阴影属性。您可以使用以下代码，它应该可以正常工作

<div id=MyTable></div>
$.ajax({
        type: 'GET',
        url: ControllerName/ActionName=partialView Which makes table. 
        success: function (data) {
            debugger;
            $('#MyTable').html(data); //Puting result of ajax call to the  div which containg Id,
            $('#PartilView_Table').DataTable({  // Applying DataTable Plugin table inside partialView                               
                "bProcessing": true,
                "bDeferRender": true,
                "scrollX": true,
                "stateSave": true,
                "bAutoWidth": true,
                "bSort": false,
                "columnDefs": [
                  {

                  }
                ]
              });
      },
      });

Answer 3

CSS3框阴影将阴影应用于元素，而不是元素的内容。换句话说，如果您有一个图像（矩形）但图像本身是圆形，则阴影将应用于矩形图像元素，而不是图像的实际主体。

<强>更新：

当然，您始终可以使用canvas元素来播放阴影。这是绘制圆圈并加载圆圈的 jsFiddle example ，然后对两者应用阴影效果。

Answer 4

使用示例here

有很好的盒子阴影教程

此外，简单的css3用于在浏览器中对角进行舍入

border-radius: 5px; 
-moz-border-radius: 5px; 
-webkit-border-radius: 5px;

只需将像素调整到您想要的角圆度，或者使用em代替

Answer 5

这件事对我有用。我想在图像32x32周围留下圆角阴影。

<a class="media-links" href="">
   <img class="media-imgs" src="">
</a>

CSS就是这样。

        img.media-imgs
        {
            -webkit-border-radius: 20px;
        }

        img.media-imgs:hover
        {
                -webkit-animation-name: greenPulse;
                -webkit-animation-duration: 2s;
                -webkit-animation-iteration-count: 1;
                -webkit-box-shadow: 0 0 18px #91bd09;
        }

Answer 6

是的，只需添加一个border-radius：50％到你的图片以及box shadow属性:)就可以在我的img标签中使用。

Answer 7

CSS不允许您为形状INSIDE图像添加阴影。 CSS不知道图像是什么样的。

Answer 8

css3中有一个属性正是你想要的。但是，当然，这还没有被所有浏览器实现（IE ...）看看那里：http://css-tricks.com/snippets/css/css-box-shadow/

Answer 9

轻松自如！在图像元素上设置border-radius: 50%;。

它会四舍五入您的图片标签，并且是阴影。

Answer 10

box-shadow: 0 0 98px 6px rgba(0, 0, 0, 0.2); // this is must but values are just an example, set accordingly.
border-radius: 50%; //this is must.

将此CSS应用于标签或其类，即可完成。

如何设置圆形图像的阴影（css）

10 个答案: