Можно ли задать стили при определенном условии другому элементу?

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

Одним из наиболее распространенных способов задания стилей при условии является использование псевдоклассов. Псевдоклассы - это ключевые слова, которые добавляются к селекторам для определения определенного состояния или контекста элемента. Некоторые из наиболее часто используемых псевдоклассов в CSS:

1. :hover - применяется, когда указатель мыши находится над элементом.
2. :active - применяется, когда элемент нажимается.
3. :focus - применяется, когда элемент получает фокус (обычно это элементы ввода, такие как текстовые поля).
4. :first-child - применяется к первому элементу внутри другого элемента.
5. :last-child - применяется к последнему элементу внутри другого элемента.
6. :nth-child(n) - применяется к элементам, которые являются n-м дочерним элементом своего родительского элемента.

Пример использования псевдоклассов:

<style>
    /* применить стили к элементу при наведении */
    .button:hover {
        background-color: #ff0000;
    }
    
    /* применить стили к первому элементу списка */
    ul li:first-child {
        font-weight: bold;
    }
    
    /* применить стили к последнему элементу списка */
    ul li:last-child {
        color: blue;
    }
    
    /* применить стили ко всем нечетным элементам списка */
    ul li:nth-child(odd) {
        background-color: #f0f0f0;
    }
</style>

<button class="button">Наведите мышь</button>

<ul>
    <li>Элемент 1</li>
    <li>Элемент 2</li>
    <li>Элемент 3</li>
    <li>Элемент 4</li>
    <li>Элемент 5</li>
</ul>

Если вам нужно применить стили к элементу на основе значений его атрибутов, вам также доступны атрибутные селекторы. Например, вы можете применить определенные стили к элементам с определенным значением атрибута:

<style>
    /* применить стили к элементу с атрибутом "href" и значением, содержащим "example" */
    a[href*="example"] {
        color: red;
    }
    
    /* применить стили к элементу с атрибутом "class" и значением "active" */
    .active {
        font-weight: bold;
    }
</style>

<a href="example.com">Пример ссылки</a>

<p class="active">Активный абзац</p>

Кроме псевдоклассов и атрибутных селекторов, в CSS также существуют другие способы задания стилей при условии, такие как использование медиа-запросов, @media правила и JavaScript-интерактивность. Более подробно о каждом из этих способов можно узнать, изучая документацию CSS или конкретные руководства и примеры.