JavaFX: переменные CSS

Question

У меня есть четыре кнопки, которые я хочу создать таким же образом, за исключением того, что каждый из них имеет уникальное изображение. есть три стиля для нормального состояния, а остальные - для зависания и фокусировки. Выполнение этого в CSS, который является рекомендуемым способом, потребует много повторений, и я искал в сети, и кажется, что переменные не поддерживаются в CSS. Итак, есть ли способ обойти это, или было бы более прагматично делать это в коде.

Answer 1

Использование CSS правильно предотвратит повторение. Вы можете совместно использовать код между четырьмя кнопками одним из нескольких способов.

Есть кнопки делить класс и стиль их различия:

<div id="btn1" class="button">Button 1</div> 
<div id="btn2" class="button">Button 2</div> 
<div id="btn3" class="button">Button 3</div> 
<div id="btn4" class="button">Button 4</div> 

<style> 
    .button { 
     color: blue; 
     background: white; 
     /* etc... */ 
    } 

    #btn1 { background-image: url('uniqueimage1.png'); 
    #btn2 { background-image: url('uniqueimage2.png'); 
    /* etc... */ 
</style> 

---

Или, что менее предпочтительно ...

Целевые несколько элементов в правиле один CSS:

<div id="btn1">Button 1</div> 
<div id="btn2">Button 2</div> 
<div id="btn3">Button 3</div> 
<div id="btn4">Button 4</div> 

<style> 
    #btn1, #btn2, #btn3, #btn4 { 
     color: blue; 
     background: white; 
     /* etc... */ 
    } 

    #btn1 { background-image: url('uniqueimage1.png'); 
    #btn2 { background-image: url('uniqueimage2.png'); 
    /* etc... */ 
</style>