圆角边框线渐变内容区背景透明

就算最后做到背景透明但是只有最外边圆角内容区不圆角

效果图：

代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSS3 border-radius边框内外圆角属性</title>
<style type="text/css">
#round2 {
	float:left;
	width:300px; height:50px;
    border: 5px solid #dedede;
    -moz-border-radius: 10px;      /* Gecko browsers */
    -webkit-border-radius: 10px;   /* Webkit browsers */
    border-radius:10px;            /* W3C syntax */
	z-index:1;
}

#round {
	float:left;
	padding:3px;
    width:294px; height:44px;
    background:white; 
	z-index:2;
}
</style> 
</head>

<body>

<div id="round2">
	<div id="round">123</div>
</div>

<br />
<br />

  


</body>

</html>

逻辑

应用堆叠，把这个图形看成两个板块

一个板块是圆角图形

一个板块是直角图形

直角图形在圆角图形之上

代码已经私聊发送给您请查收

麻烦点个采纳了

外边距可以设置圆角

内边距也可以设置圆角

我想做成这个形状的边框线背景渐变，且中间内容区背景透明现只能做成最外边有圆角，中间透明，怎么能做成我图上这种形状的背景区透明，我尝试了好多方法

您好，我是有问必答小助手，您的问题已经有小伙伴解答了，您看下是否解决，可以追评进行沟通哦~

如果有您比较满意的答案 / 帮您提供解决思路的答案，可以点击【采纳】按钮，给回答的小伙伴一些鼓励哦～～

ps:问答VIP仅需29元，即可享受5次/月有问必答服务，了解详情>>>https://vip.csdn.net/askvip?utm_source=1146287632

这个问题不要把背景图跟按钮里的背景颜色一样，这样不叫透明，如果是花色的图片，不透明根本没办法显示背景色

博主，怎么实现的，我也遇到这个问题了