Показать сообщение отдельно
  #4 (permalink)  
Старый 18.01.2021, 15:12
Профессор
Отправить личное сообщение для Сергей Ракипов Посмотреть профиль Найти все сообщения от Сергей Ракипов
 
Регистрация: 01.06.2010
Сообщений: 668

Сообщение от рони Посмотреть сообщение
Сергей Ракипов,
может css :hover?
Так вот я что то пробую но не срабатывает.

<!doctype html>
<html lang="ru">

<head>
    <meta charset="utf-8">
    <title>index</title>

    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta name="description" content="index">
    <meta name="Keywords" content="index">
    <style>
        .blok {
            width: 400px;
            height: 100px;
            margin: 10px auto;
        }

        .kvadrat {
            width: 100px;
            height: 100px;
            border: 3px solid #000;
            cursor: pointer;
        }

        .kvadrat.aktiv {
            border: 3px solid #0504aa;
        }

        .kvadrat:focus {
            outline: none;
        }
        .kvadrat:hover .zagolovok{
            color:#0504aa
        }
    </style>
</head>

<body>
    <div class="blok">
        <h1 class="zagolovok">Заголовок</h1>
        <button class="kvadrat aktiv"></button>
        <button class="kvadrat"></button>
        <button class="kvadrat"></button>
    </div>

</body>

</html>


Вроде все сделал правильно, но заголовок не меняет цвет при наведение на квадрат.

И у меня вот таких блоков будет штук 6

<div class="blok">
<h1>Заголовок</h1>
<button class="kvadrat"></button>
<button class="kvadrat"></button>
<button class="kvadrat"></button>
</div>
Ответить с цитированием