css - md 图标上的自定义样式
问题描述
我想使用材料设计图标,但由于某种原因,材料团队决定在图标上添加一个框和圆圈。我想使用account_box
图标但没有框。
我已经一起破解了这个例子:https ://plnkr.co/edit/7z0XbZ?p=preview
哪个使用这个css:
.circle {
background: red;
border-radius: 50%;
height: 50px;
width: 50px;
display: inline-block;
}
.circle .filler {
border-radius: 50%;
display: inline-block;
height: 23px;
width: 23px;
background: #fff;
position: absolute;
top: 22px;
left: 22px;
}
.circle i {
font-size: 2em;
position: relative;
padding: 9px;
color: red;
}
但这是一个可怕的解决方案。还有另一种方法可以做到这一点吗?
解决方案
我忽略了一个图标:person
,正是我需要的。
推荐阅读
- java - 如何在第一个 MethodCall 的第一个参数上使用另一个 MethodCall 调用 MethodCall?
- python - python中调用函数时局部符号表如何交互?
- java - 如何使用 Java API 在 Google Dataproc 集群上设置可选属性?
- python - Import flask_wtf 与 jupyter notebook 一起工作正常,但命令提示符出现错误
- python - Python“冻结”不包括命名空间
- css - 使用导入模块中的变量时 SASS '无效的 css 错误'
- python - 作业中有或没有括号都做同样的事情
- laravel - AWS 上的 Laravel 调度任务不起作用
- asp.net - Asp.net 和 compatibilityMode 为什么 compatibilityMode="Framework20SP2" 工作?
- flutter - 如何详细添加“添加到收藏”按钮或图标,将添加到 Flutter 中的“收藏”页面