Суммируя классы CSS не работают

Я использую разные шрифт Потрясающие иконки и я попытался обобщить эти строки:Суммируя классы CSS не работают

Css

ul.long_arrow_right,ul.minus,ul.long_arrow_circle_right {list-style: none;} 
ul.long_arrow_right   > li:before {content:"\f178"; font-family: FontAwesome;display: block;float: left;width: 1.5em;} 
ul.minus     > li:before {content:"\f068"; font-family: FontAwesome;display: block;float: left;width: 1.5em;} 
ul.long_arrow_circle_right > li:before {content:"\f0a9"; font-family: FontAwesome;display: block;float: left;width: 1.5em;}

Для использования шрифтов Высокий вы должны включить его в HTML голову ,

HTML голова

<link rel="stylesheet" type="text/css" media="screen" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" />

CSS-код, который не работает правильно

ul.long_arrow_right   > li:before {content:"\f178";} 
ul.minus     > li:before {content:"\f068";} 
ul.long_arrow_circle_right > li:before {content:"\f0a9";} 
ul.long_arrow_right,ul.minus,ul.long_arrow_circle_right {list-style: none;} 
ul.long_arrow_right,ul.minus,ul.long_arrow_circle_right > li:before {font-family: FontAwesome;display: block;float: left;width: 1.5em;}

Возможно ли обобщить этот CSS код?

источник

2016-03-27 Grischa

Что вы подразумеваете под 'summaryize'? –

Не знаю, что вы здесь задаете –

Как и в моем вопросе: Я хочу иметь дубликаты команд 'font-family: FontAwesome; display: block; float: left; width: 1.5em;' только один раз, если это возможно. – Grischa

CSS-код, который не работает правильно

Объяснения этого правила

ul.long_arrow_right,ul.minus,ul.long_arrow_circle_right > li:before {}

он выбирает этих элементы

<ul class='long_arrow_right'></ul> 
<ul class='minus'></ul> 
<ul class='long_arrow_circle_right'><li></li></ul> //the li is selected

Так целевые задачи 2 ul элемента и li's под ul.long_arrow_circle_right. Вам нужно изменить селектор.

, что вы хотите,

ul.long_arrow_right > li:before ,ul.minus > li:before ,ul.long_arrow_circle_right > li:before { 
    font-family: FontAwesome; 
    display: block; 
    float: left; 
    width: 1.5em; 
}

Или вы можете установить класс для всех ul элементов, которые нужно это правило, а затем просто сделать это.

ul.fontAwesomeRule > li:bfore{ 
    font-family: FontAwesome; 
    display: block; 
    float: left; 
    width: 1.5em; 
}

Так идти вперед и добавить этот класс fontAwesomeRule всем ul элементы, которые вы хотите настроить таргетинг.

источник

2016-03-27 07:15:23

Суммируя классы CSS не работают

ответ

Смежные вопросы