使用css实现特殊标志或图形
1. 前言
由于图片占的空间比较大,且图片越多,越不好管理,所以有些时候,我们可以使用一些简单的标签样式来实现简单的图形标志来替代图片。
2. 实例展示:
三角形示例
示例代码:
方向箭头示例
示例代码:
空缺圆
*{ padding:0; margin:0; } div:before{ content:""; width:20px; height:20px; position:absolute; top:-10px; left:40px; border-radius:50%; background-color:white; } div{ position:relative; width:100px; height:100px; margin:100px auto; box-shadow:0 0 2px red; background-color:#ccc; }
到此这篇关于使用css实现特殊标志或图形的文章就介绍到这了,更多相关css特殊标志内容请搜索潘少俊衡以前的文章或继续浏览下面的相关文章,希望大家以后多多支持潘少俊衡!
版权声明
本文仅代表作者观点,不代表本站立场。
本文系作者授权发表,未经许可,不得转载。
本文地址:/web/CSS/74058.html