我试图在链接中使用图标堆栈.当我只使用一个图标时,一切正常.但是当尝试使用堆叠图标时,它不会像单个图标那样出现在链接中.
我使用的第一种方法是:
<a href="#" class="tweet"><span class="icon-stack"><i class="icon-circle icon-stack-base"></i><i class="icon-twitter"></i></span>tweetthis</a>
Run Code Online (Sandbox Code Playgroud)
看过:破碎的堆积图标
这给了我两个图标左对齐(偏离中心)并且图标显示在文本顶部的东西.
我原以为包含带有图标堆栈类的跨度代替单个<i>将是实现它的方法,但事实并非如此.这很好用:
<a href="#" class="tweet"><i class="icon-circle"></i><i class="icon-twitter"></i>tweetthis</a>
Run Code Online (Sandbox Code Playgroud)
看过:内联图标
我不知道容器放在哪里<span>,或者是否需要添加更多样式.我尝试了各种组合.设置ato display:block没有帮助(没有其他样式应用于链接).
当链接中没有文本时,结果是相同的.设置.icon-stack容器类display:block确实有用,但它并不完美,因为基本图标比顶部的图标大得多.
这有可能吗?或者我是否应该使用堆叠图标的限制?