Селекторы, часть 3 / Поиск подстроки везде: [foo*="bar"] [3/18]
×

Поиск подстроки везде: [foo*="bar"] [3/18]

Следующий вариант записи [foo*="bar"]

Будут выбраны все элементы, у которых значение атрибута foo содержит подстроку bar на любой позиции

Среди трёх элементов:

<p class="person-name"></p>
<div class="some-person-info"></p>
<span class="date-person"></span>

селектор [class*="person"] выберет все.

Обратите внимание, что селектор чувствителен к регистру.


Выполнить задание
HTML
<!DOCTYPE html> <html lang="ru"> <head> <title>Поиск подстроки везде: [foo*="bar"]</title> <meta charset="utf-8"> <link rel="stylesheet" href="/assets/course58/style.css"> </head> <body> <header class="page-header">Форма личных данных</header> <main> <form action="/echo" method="post"> <fieldset> <legend>Заявление на получение визы на кухню</legend> <div class="half-width"> <label>Имя кота</label> <input type="text" name="name" value="Кексик"> </div> <div class="half-width"> <label>Котопаспорт</label> <input type="text" name="passport" value="KEKS-66893"> </div> <div class="half-width"> <label>Дата рождения</label> <input type="datetime" name="birthday" readonly value="18-07-2012"> </div> <div class="half-width"> <label>Посещения</label> <select name="type"> <option value="Каждый час">Каждый час</option> <option value="Каждые 3 часа">Каждые 3 часа</option> <option value="2 раза в день" selected>2 раза в день</option> <option value="1 раз в день">1 раз в день</option> </select> </div> <label>Любимые сладости</label> <input type="text" name="sweets" value="Люблю ванильные кексы и с изюмом"> <div class="half-width"> <label>Дата заявления</label> <input type="datetime" name="date" value="02-06-2014"> </div> <div class="half-width"> <label>Подпись</label> <input type="datetime" name="sign" value="Просто Кекс"> </div> <label>Слоган</label> <input type="text" name="slogan" value="Если ты Кекс - ешь кекс"> </fieldset> <div class="buttons"> <input type="submit" value="Оформить"> </div> </form> </main> <footer class="page-footer"></footer> </body> </html>
CSS
HTML Academy
  1. Всем элементам input, у которых значение атрибута value содержит подстроку кекс установите цвет текста #3498db.
  2. А если подстрока равна Кекс, то цвет текста должен быть #e74c3c.
Теория Проверить Следующее задание
Идёт запись на курс Базовый HTML и CSS #16, который стартует 16 января.

Обсуждение и комментарии

Если у вас возникли сложности при прохождении задания, то вы можете обратиться за помощью на наш форум. Мы отслеживаем сообщения и постараемся ответить максимально быстро.

Пожалуйста, не пишите решение задач. Такие сообщения будут удаляться.

Перейти на форум или открыть комментарии.