开发者社区> 问答> 正文

如何实现透明效果的border呢?

如图
screenshot

圆都好实现,但是透明效果的border该如何实现呢?

展开
收起
杨冬芳 2016-06-06 18:03:22 1830 0
1 条回答
写回答
取消 提交回答
  • IT从业

    box-shadow 可能更合适一点

    <style type="text/css">
    .outer {
      padding: 2em;
      background-color: #ccc;
    }
    .circle {
      width: 100px;
      height: 100px;
      border-radius: 50%;
      background-color: #F36A22;
      box-shadow: 0 0 0 10px rgba(243, 106, 34, .4);
    }
    </style>
    <div class="outer">
      <div class="circle"></div>
    </div>
    2019-07-17 19:29:10
    赞同 展开评论 打赏
问答地址:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载