css3有内置图标吗?
css3没有内置图标,所有的图标都需要用户自己下载后使用。
但是我们可以通过设置特殊字符,来实现图标的样式。(推荐学习:CSS视频教程)
下面是一个特殊字符来代替图标的案例:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style> .cross{ width: 20px; height: 20px; background-color: #F3F9FF; border-radius: 10px; border: 1px solid #DBE6EF; display: inline-block; position: relative; } .cross:after{ content: "\2715";//特殊字符或形状 color: #a2b6c5; font-size: 12px; position: relative; left: 4px; bottom: 3px; cursor: pointer; } </style> </head> <body><div></div> </body> </html>
效果图:
主要是使用了伪类元素 ::before 实现的,将特殊字符的代码写在content里即可。
下面为各位整理了一些常用的特殊字符,可以在项目中使用它们代替图标。
基本形状
▲ 25B2 ► 25BA ► 25BA ▼ 25BC
◄ 25C4 ❤ 2764 ✈ 2708 ★ 2605
✦ 2726 ☀ 2600 ◆ 25C6 ◈ 25C8
▣ 25A3
更多CSS相关技术文章,请访问CSS3答疑栏目进行学习!
以上就是css3有内置图标吗?的详细内容,更多请关注易知道|edz.cc其它相关文章!