Можно ли проверить, пуст ли элемент S CSS? - PullRequest
Новая
       10

Можно ли проверить, пуст ли элемент S CSS?

0 голосов
/ 25 апреля 2020

Можно ли проверить, не является ли элемент пустым, используя S CSS?

Например, я хочу объявить переменную, если класс пуст. 

<div class="defaultClass">
   <!-- empty, has no child -->
</div>

Примерно так: 

$variable: 100%;

.defaultClass {
    @if & not empty {
        $variable: 50%;
    } 
}

1 Ответ

1 голос
/ 25 апреля 2020

В настоящее время вы можете использовать javascript только для определения, является ли элемент пустым или нет. В основном вам нужно проверить, имеет ли элемент внутренний HTML. Затем установите некоторые переменные на основе этого.

В настоящее время существует рабочий черновик для CSS4, который позволяет определить, есть ли у элемента содержимое. https://developer.mozilla.org/en-US/docs/Web/CSS/: имеет

Теоретически вы сможете проверить, имеет ли элемент какие-либо или очень специфические c дочерние элементы. 

div:has(*){
/* do this if the div has children */
--variable: 50%;
}

Аналогично, будет селектор, который может проверить, является ли элемент пустым. https://developer.mozilla.org/en-US/docs/Web/CSS/: пусто 

div:empty {
/* do this if the div has no children */
--variable: 50%;
}

До тех пор, пока проекты не будут реализованы. Sass не сможет использовать эти функции.

...