首页 > 代码库 > div元素呈圆环排列
div元素呈圆环排列
<style>.path {width: 300px;height: 300px;padding: 20px;border-radius: 50%;background: rgba(79, 11, 152, 0.5);;margin: 50px auto;}.avatar {width: 50px;margin: 0 auto;border-radius: 50%;overflow: hidden;display: block;transform-origin:50% 150px; position: absolute;}</style> <div class="avatar" style="transform: rotate(0deg);"> <img src="https://www.baidu.com/img/bd_logo1.png" width=‘50‘ height=‘50‘ style=‘transform: rotate(0deg);‘/> </div> <div class="avatar" style="transform: rotate(72deg);"> <img src="https://www.baidu.com/img/bd_logo1.png" width=‘50‘ height=‘50‘ style=‘transform: rotate(-72deg);‘/> </div> <div class="avatar" style="transform: rotate(144deg);"> <img src="https://www.baidu.com/img/bd_logo1.png" width=‘50‘ height=‘50‘ style=‘transform: rotate(-144deg);‘/> </div> <div class="avatar" style="transform: rotate(216deg);"> <img src="https://www.baidu.com/img/bd_logo1.png" width=‘50‘ height=‘50‘ style=‘transform: rotate(-216deg);‘/> </div> <div class="avatar" style="transform: rotate(288deg);"> <img src="https://www.baidu.com/img/bd_logo1.png" width=‘50‘ height=‘50‘ style=‘transform: rotate(-288deg);‘/> </div>
div元素呈圆环排列
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。