CSS: clip-path:多边形圆角边框

文章/答案/技术大牛

发布

1回答

css、clip-path

我正在尝试使这个多边形的顶部和底部边缘与图标相同。有人知道我做错了什么吗？ ;.activity__icon { text-align: center; clip-path: middle; } <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesom

浏览 108提问于2020-11-28得票数 0

回答已采纳

3回答

如何用CSS (或SVG)部分裁剪边框？

css、svg、border、clip

我想剪辑边框的div，其中有一些border-radius，以模仿如何计时器过期。但是构建自定义多边形似乎很难控制边框长度。有什么更简单、更优雅的方法来处理CSS (或者SVG)呢？

浏览 0提问于2018-01-25得票数 0

回答已采纳

1回答

如何在使用裁剪路径时保持边界半径？

css、clip-path、border-radius

但我面临的问题是，剪辑路径不能剪辑圆角边框border-radius: 0.5rem;。我搜索了一下，发现可以使用多边形来裁剪路径。我找到了一个链接，你可以在这里生成要裁剪的多边形项目：Clip poly generator。但是我找不到一个完美的多边形。圆圈是圆角的，斜角项目只有锐利的边框。 position: relative; height: 6rem; border-

浏览 16提问于2021-03-29得票数 1

回答已采纳

1回答

如何用CSS边框半径创建直角？

css

我试图用CSS边框-radius属性创建这种直角：但到目前为止，我只得到了基本的CSS圆角。有人有办法解决这个问题吗？我试着不使用图像来创造效果。提前谢谢。

浏览 3提问于2016-06-06得票数 3

回答已采纳

1回答

剪裁SVG多边形接收鼠标事件

svg、polygon、rounded-corners、clipping、pointer-events

以下是事实：为什么当我悬停在一个被剪裁的区域时，响应鼠标的元素就会过去呢？我怎样才能确保这不

浏览 1提问于2014-03-18得票数 4

1回答

包含文本的CSS中的非结构化形状

css

我试图设计形状，作为下面的截图，我成功地设计了它，但问题是我无法在里面填充文本，文本总是出现在div之后。<html><meta name="viewport" content="width=device-width, initial-scale=1">.div2{ border-right: 25px solid transparent;

浏览 3提问于2021-06-13得票数 0

回答已采纳

1回答

如何在CSS中的剪辑路径多边形中为图片创建圆角(img标记)

javascript、html、css

在我的设计中，我必须创建一个圆角多边形。就像这张照片。 img {} <img src="assets

浏览 8提问于2022-05-18得票数 0

2回答

WPF设计时属性

c#、wpf

我已经构建了一个UserControl，它基本上是一个网格，它的两端可以是圆角，也可以是某个多边形。我有一个四舍五入的属性，它改变圆角边框和多边形的可见性以匹配(如果有人将Rounded=设置为“True”，则圆角边框可见，多边形隐藏，反之亦然。

浏览 13提问于2019-01-18得票数 0

1回答

我在CSS中做了一个T恤形状的多边形，它显示的完全一样，除非我试图在悬停时将它动画化。一旦我悬停，我得到一个正确的和底部的边框，相同的颜色，为多边形设置的背景，而动画正在发生。动画完成后，边框再次消失。我试过所有的东西，从改变边框大小/颜色和背景等，但什么都没有改变。polygon(68% 5%, 32% 5%, 0 24%, 9% 44%, 25% 36%, 25% 90%, 75% 90%, 75% 36%, 91% 44%, 100% 24%); cl

浏览 1提问于2016-01-11得票数 2

回答已采纳

1回答

三角形css中的图像？

css、user-interface

我想实现一个自定义图像三角形形状与圆角像这样使用css我在寻找如何做到这样却一无所获，我想实现我的css可以做到这样的效果，有什么想法吗？如果我的问题看起来像其他问题，很抱歉谢谢

浏览 2提问于2013-06-25得票数 0

7回答

田野集上的圆角

html、css、internet-explorer、rounded-corners、fieldset

我注意到"fieldset“标记在IE上呈现圆角边框(它在其他浏览器上呈现平方)。<fieldset></fieldset>有人知道为什么吗？如何保持圆角，但与另一边框颜色？编辑:对不起，不好意思，我不问如何在火狐/其他浏览器上设置圆角，我想知道如何在

浏览 8提问于2009-06-02得票数 27

回答已采纳

1回答

剪辑路径:曲线边缘，背景图像和三角形。

css、frontend、pseudo-class、clip-path、border-radius

我试图用圆角和背景图像构建以下元素：我最初对三角形使用了:after元素，但是我无法获得背景图像“流血”，因为从技术上讲，它是一个单独的元素。但是，由于元素的底部是三角形结束的地方，边框半径只影响顶角。我现在在这里：.service_item{ background: var(--color-yellow); background-size:cover; background-position:ce

浏览 4提问于2022-07-20得票数 0

回答已采纳

2回答

使用CSS2的CSS提升边框

css

使用当前的CSS而不是CSS3，有什么方法可以指定凸起类型的边框样式吗？我想以某种方式强调一下我的菜单。基本上我想要的边框是圆角的，而不是圆角的。

浏览 1提问于2010-07-26得票数 0

回答已采纳

2回答

带渐变边框的透明圆形按钮

css、svg、linear-gradients

我正在尝试使用纯css创建下面的按钮。它有以下要求。 6px; border-image-slice: 1; clip-path

浏览 0提问于2019-01-18得票数 4

回答已采纳

1回答

用于woocommerce的css中的自定义边框

javascript、html、css、wordpress、woocommerce

他希望所有的产品图像都应该有一个边框(或形状)，如下图所示： ? 

浏览 10提问于2020-04-29得票数 0

回答已采纳

5回答

避免CSS边界半径中的椭圆形状

html、css

矩形div使用边框半径CSS生成椭圆角而不是圆角。我怎样才能得到完美的圆角矩形div？

浏览 3提问于2015-07-24得票数 51

回答已采纳

10回答

可以将边界半径与具有渐变的边界图像一起使用吗？

css

我正在设计一个具有圆角边框(边框半径)的输入域的样式，并尝试添加一个渐变到所述边框。我可以成功地制作渐变和圆角边框，但两者都不能一起工作。它要么是没有渐变的圆角，要么是有渐变的边框，但没有圆角。webkit-border-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b0bbc4), to(#ced9de)) 1 100%; 有没有办法让这两个CSS

浏览 10提问于2011-04-19得票数 89

回答已采纳

1回答

如何使用css为圆角边框提供不同的颜色？

html、css、font-awesome、border-radius

我想放置不同边框与不同颜色的圆角图标。像我想要的那样链接图像。我设计圆角使用顺风css类，我没有得到如何给予不同的边框颜色。

浏览 4提问于2022-02-15得票数 -1

回答已采纳

3回答

如何创建圆角图像边框？

jquery、xhtml、css

有没有可能做圆角CSS边框，一旦用户上传了图像？我想让css做一个圆角边框，如下图所示：所以任何css都需要和IE7一起工作。

浏览 1提问于2011-09-26得票数 0

回答已采纳

2回答

如何将SVG夹到笔划的内侧？

html、css、svg

我读过许多关于CSS剪裁的教程，其中通常有一些使用多边形裁剪路径的简单示例，然后深入到BNF语法片段，描述如何在没有任何有意义的示例的情况下使用几何图形框。我把这解释为用填充框代替边距框将在我的示例中设置相对于蓝色矩形的多边形(路径填充的边框)，因此我可以制作一个宽度为100%的多边形，>100%的高度矩形。在实践中，当我将样式设置为"clip-path: polygon(0% -30%, 0% 130%, 100% 130%, 100% -30%) fill-box&q

浏览 5提问于2020-04-17得票数 0

回答已采纳

点击加载更多