背景图像中的Bootstrap svg链接不适用于单选按钮,复选框,图标等

时间:2018-01-06 15:57:38

标签: twitter-bootstrap svg bootstrap-4

我想用我自己的样式自定义标准Bootstrap,所以我复制了带有bootswatch.com/default中所有Bootstrap元素的html页面。我已经更改了" link"中的目录。和"脚本"使用所需的Bootstrap和其他文件标记到项目中的目录。

一切正常,但当我滚动页面时,我发现单选按钮内的白色圆圈和chechboxes内的复选标记丢失了:

应该是:screenshot。 我得到了什么:screenshot

我认为在我的引导程序中没有必需的样式。然后我去代码检查员找到问题的解决方案。

使用带有svg图像的背景图像添加圆圈(或其他元素):screenshot。在我的页面上是:screenshot。来自bootswatch.com的链接是一个圆圈(或其他元素):screenshot。我得到了error。我以为我的Bootstrap有错误的风格。但是所有的东西都与bootswatch.com的Bootstrap相匹配,并且所有这些都适用于背景图像的变量:screenshot。我从bootswatch.com复制了链接并覆盖了我的引导程序中的样式,但没有改变:screenshot

任何人都知道如何修复它?

1 个答案:

答案 0 :(得分:0)

问题出在YUICompressor(压缩.css和.js文件):

https://github.com/yui/yuicompressor/issues/304

删除SVG字符串中所需的空格。这导致CSS规则背景图像效率低下。