虚线圆
CSS实现的虚线圆形使用CSS实现的用虚线线条画的圆圈,虚线呈现蓝色与棕色相间的色彩,主要是通过合理的设置CSS的mask以及background属性实现的,可对圆形虚线线条的密度、宽度以及颜色进行自定义。
布莱格
Bootstrap简约风格响应式博客网站模板,包含25+HTML内页及5大布局风格!这是一款高端简约风格的博客和杂志网站模板,具有极高的灵活性和完全响应式的设计。该模板总提供了25+HTML内页,含5种主页个性主页布局以及5种博客列表布局功能页面,无论是个人博客、杂志网站、新闻...
聚焦轮廓
CSS实现照相机聚焦形状效果使用CSS实现的聚焦图形效果,由四个角的图形聚拢到一起形成的效果,可以将文字或者图片置于聚焦图形的内部,形成聚焦边框效果,同时也可以将此效果应用于聚焦图标场景使用,底层是基于CSS的mask以...
电池电量
CSS实现的电池电量形状图标使用CSS实现的电池电量图标图形效果,经常用于手机系统表示电量,底层是通过合理设置CSS的background以及inset属性实现的电池图标,电量格数以及电池大小外观颜色支持自定义。
wifi图标
CSS实现的WIFI网络图标基于CSS实现的wifi网络图标,进需要10几行CSS代码便可实现非常的轻量级,底层主要使用了CSS的mask、background以及border-radius等关键属性实现。WIFI图标支持...
禁止通行图标
CSS实现禁止通行⛔️图标,实现圆圈中包围减号效果使用CSS实现禁止通行图标,交规中的禁止通行标志如何通过CSS去实现呢?其实只需要五行左右的代码即可实现,主要使用了CSS的border-image以及background属性去实现。
叉号
CSS实现的两种款式错误叉号图标基于CSS实现的两款表示错误信号的图标,只需要10行左右的CSS便可实现,中间是一个错误叉号外围是圆圈,圆圈⭕️包围❌叉号,很典型的错误信息表示方法,很实用的一个图标。底层基于CSS的borde...
标签图标
CSS使用两种不同方式实现被圆形包围的十字加号图标形状基于CSS使用两种不同的方式实现的外围被圆形包围的十字加号图标形状,一种是border-image结合clip-path两大主要属性实现的,另一种是通过border-radius结合backgr...
网状方格
CSS实现四方网格形状,利用实线网格线与虚线网格线创建的网状方格通过CSS合理的设置div的background、width、height属性可得到多个四方格排列的网格图形,包含虚线网格与实线网格两种。其中,网格的大小、数量以及线型支持自定义。
阴阳八卦
CSS实现阴阳八卦图合理设置CSS的background属性的radial-gradient以及conic-gradient等关键属性值即可显示一个阴阳八卦图,阴阳八卦图形支持大小、颜色以及旋转角度的自定义。

