Bootstrap 3 без глификонов заменен на Font Awesome

Question

Я хочу удалить глификоны Bootstrap 3 в пользу Font Awesome.Поскольку Font Awesome уже включает в себя большую часть глификонов, вы не хотите их включать, чтобы избежать дублирования и проблем совместимости.

когда я делаю настроенную загрузку начальной загрузки и снимаю флажок с компонента глификона, я все еще вижу некоторые ссылки на глификон в файле css. http://getbootstrap.com/customize/

Как я могу полностью отключить эти значки?

Спасибо

Answer 1

Эти 6 оставшихся ссылок на глификоны в скомпилированном CSS относятся к дополнительному использованию глификонов для кнопок «следующий+предыдущий» в компоненте «Карусель».Поскольку рассматриваемые объявления также используются для кнопок next+prev, отличных от Glyphicon, и представляют собой совершенно тривиальную часть общего размера файла, я предлагаю просто игнорировать их.Для практических целей вы уже исключили глификоны из своей сборки.

Если вам абсолютно необходимо уничтожить указанные ссылки, то скомпилировать Bootstrap вручную, предварительно удалив оскорбительные строки из bootstrap/less/carousel.less и удаление @import "glyphicons.less"; линия из bootstrap/less/bootstrap.less.
Или вы можете просто вручную отредактировать CSS, который уже сгенерировал для вас настройщик Bootstrap, поскольку соответствующие удаления тривиальны.

Answer 2

Как я использую bootstrap с шрифтом потрясающе, я перехожу настроить страницу, и я не проверял компонент Glyphicon, как вы сделали, но в течение некоторого времени я также добавить эту строку кода в мой (переопределенный файл):

[class^="icon-"],
[class*="icon-"] {
  background: none;
}

.

Также вы можете открыть основной файл Bootstrap, который вы загрузили (настроили один) и ищите font-family: 'Glyphicons Halflings';, затем комментируйте все @font-face.

Надеюсь, это поможет вам

Answer 3

Решение для Меньше (протестировано для bootstrap 3.3.5):

Во-первых, переопределите иконки для карусели:

// Overloading "glyphicon" class with "fa".
.glyphicon
{

    &:extend(.fa);

    // Overloading "glyphicon-chevron-left" with "fa-arrow-left".
    &.glyphicon-chevron-left
    {
        &:extend(.fa-chevron-left);
    }

    // Overloading "glyphicon-chevron-right" with "fa-arrow-right".
    &.glyphicon-chevron-right
    {
        &:extend(.fa-chevron-right);
    }
}

Эта часть взята из Слава Фомин, ответь, основанный на книге Стивена Клонтца базовый код.

Следующий шаг:отключить загрузку глификов:

//** Load fonts from this directory.
@icon-font-path:          "../fonts/";
//** File name for all font files.
@icon-font-name:          "fontawesome-webfont";
//** Element ID within SVG icon file.
@icon-font-svg-id:        "fontawesomeregular";

Не забывайте о меньшем количестве отложенная загрузка: @icon-font-svg-id а другие переменные будут иметь последнее установленное вами значение.