Можно ли задать условие в CSS?

Question

[Простой Человек]

Наподобие, как в PHP. Например:
Если в коде сайта в header присутствует ссылка:

<table class="header">
    <a href="index.php">
        <img src=""src="http://сайт.ру/forum/images/logos/day.jpg">
    </a>
</table>

то оформить определённую кнопку белым фоном, а если так:

<table class="header">
    <a href="index.php">
        <img src=""src="http://сайт.ру/forum/images/logos/night.jpg">
    </a>
</table>

то тёмным фоном.

Comments

[Alexander]

в sass или less можно задавать условия

[Простой Человек]

Alexander: ну, это не подойдёт, так как он требует установки на сервер.

Answer 1

[Егор Кашлинов]

В css вы можете зацепиться за атрибут src изображения с помощью селектора атрибутов так:

header a > img[src$="day.jpg"] {...}
header a > img[src$="night.jpg"] {...}

Но вот выбрать рекурсивно родительский элемент, который хотите оформить в зависимости от значения атрибута src картинки — не получится. Выбрать родителя по селектору дочернего элемента на текущий момент используя только CSS нельзя.

Выше Zhainar дал ссылку на пример манипулирования элементом img в зависимости от определённых условий в родительском элементе. Скорее всего, это вам поможет.

Comments

[Простой Человек]

Пожалуй твой вариант лучший, который пригодится.

ПС. А есть ли способ выбора родительского элемента с клиентской стороны?

Answer 2

[Zhainar]

https://jsfiddle.net/00nmue7d/1/

идея про картинки тут:
stackoverflow.com/questions/2676436/define-an-imgs...

Answer 3

[xuxubla]

Еще можно дождаться CSS4.

Answer 4

[Андрей]

Как вариант, если надо именно на клиенте, то надо немного переделать верстку, сделать 2 класса типа .day и .night, и скриптом применять один из классов блоку в зависимости от условия...

А так предыдущий камент вполне раскрывает суть.