问题描述
我正在尝试自动向Material for MkDocs中的链接添加图标。自动在链接中找到不同的扩展名并添加正确的图标。 tutorial
我想要的外观与在.md文件中添加图标的外观相同。例如相同大小的蓝色等 图标来自Materials package
.md-typeset a[href$='.docx'] {
background: transparent url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M15.5 17H14l-2-7.5-2 7.5H8.5L6.1 7h1.7l1.54 7.5L11.3 7h1.4l1.97 7.5L16.2 7h1.7M19 3H5c-1.11 0-2 .89-2 2v14a2 2 0 002 2h14a2 2 0 002-2V5a2 2 0 00-2-2z"></path></svg>')center right no-repeat;
padding-right: 24px;
}
这可以正常工作,但是图标的颜色是黑色且无聊。
第二次尝试使用.css文件:
.md-typeset a[href$='.docx']::after {
content: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M15.5 17H14l-2-7.5-2 7.5H8.5L6.1 7h1.7l1.54 7.5L11.3 7h1.4l1.97 7.5L16.2 7h1.7M19 3H5c-1.11 0-2 .89-2 2v14a2 2 0 002 2h14a2 2 0 002-2V5a2 2 0 00-2-2z"></path></svg>')
}
这导致一个巨大的黑色图标...
当我查看生成的.html
文件时,我发现从.md
文件生成的图标带有例如:material-file-word-Box:
嵌套在<span<span class="twemoji">
内。
有什么好主意吗?
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)