如何在CSS中使用FontAwesome图标覆盖Bootstrap的<blockquote> border-left？

Question

当一个<blockquote>出现在我的div中时,我想覆盖它,以便它使用FontAwesome icon-quote-left而不是border-left: 5px rgb....它现在使用的值.

我怎么能用CSS做到这一点？

我不想使用JS - 因为它给页面增加了太多的负载.

Answer 1

您可以使用CSS Pseudo元素执行此操作.这是一个JSFiddle来演示:http://jsfiddle.net/cvADH/

/* Override the bootstrap style */
blockquote {
    border-left: none;
}

/* Insert the pseudo element - replicating what FontAwesome does */
blockquote:before {
    content: "\f10d"; 
    font-family: FontAwesome;
    float: left;
    margin-right: 10px;
}