Испытание: формы — вспомнить всё [1/28]


#23

Прежде, чем делать это испытание, Вам не мешало бы ещё раз пройти “Знакомство с формами”, тем более, оно из бесплатного раздела


#24

Чесно, на код больно смотреть. Перенеси этот код в текстовый редактор, сохрани например как index.html, залей на сайт проверки валидности. Если учиться хорошему, то с самого начала.


#25

Я так и не понял, что именно “всё плохо”? :slight_smile:

C <label> разобрался, а что еще???

Проверка на валидность 2 ошибки…


#27

Может громко сказано было😁 Имел ввиду форматирование кода.


#28

Использовать name=“name” это нормальная практика?


#30

Добрый день! Выполнил это задание на 99% Подскажите, пожалуйста, что не так?


Код:

 <!DOCTYPE html>
<html lang="ru">
  <head>
    <title>Испытание: формы — вспомнить всё</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <form action="/echo" method="post">
      <label>Имя</label>
      <input type="text">
      <div class="half-width">
        <label for="date-field">Дата рождения</label>
        <input type="text" class="date" name="date-of-birth" id="date-field">
      </div>
      <div class="half-width">
        <label for="color-field">Цвет</label>
        <select name="color" id="color-field">
          <option selected value="redhead">Рыжий</option>
        </select>
      </div>
      <label>
        <input type="checkbox">
        Разрешать гладить
      </label>
      <label for="password-field">Секретное блюдо</label>
      <input type="password" name="secret-food" id="password-field">
      <div class="buttons">
        <input type="submit" value="Сохранить">
      </div>
    </form>
  </body>
</html>

#31

Эта часть ничем не связана.


#32

Спасибо за ответ! Исправил эту ошибку, однако процент все еще 99. В “Различиях” красным отмечена буква Ш.


Код:

<!DOCTYPE html>
        <html lang="ru">
          <head>
            <title>Испытание: формы — вспомнить всё</title>
            <meta charset="utf-8">
            <link rel="stylesheet" href="style.css">
          </head>
          <body>
            <form action="/echo" method="post">
              <label for="name-field">Имя</label>
              <input type="text" name="your-name" id="name-field">
              <div class="half-width">
                <label for="date-field">Дата рождения</label>
                <input type="text" class="date" name="date-of-birth" id="date-field">
              </div>
              <div class="half-width">
                <label for="color-field">Цвет</label>
                <select name="color" id="color-field">
                  <option selected value="redhead">Рыжий</option>
                </select>
              </div>
              <label>
                <input type="checkbox">
                Разрешать гладить
              </label>
              <label for="password-field">Секретное блюдо</label>
              <input type="password" name="secret-food" id="password-field">
              <div class="buttons">
                <input type="submit" value="Сохранить">
              </div>
            </form>
          </body>
        </html>

#33

Там тоже label и input не связаны, возможно в этом дело.


#34
<label>
                <input type="checkbox">
                Разрешать гладить
 </label>

Я связал input и текст подписи просто обернув input тегом . Это не допустимо? Вроде бы в начале курса “Знакомство с формами” описан такой способ связки.


#35

Попробовал привязать через id, но в “Различиях” появились те же самые красные отметки, что и в первом моем скрине.


Код:

            <!DOCTYPE html>
            <html lang="ru">
              <head>
                <title>Испытание: формы — вспомнить всё</title>
                <meta charset="utf-8">
                <link rel="stylesheet" href="style.css">
              </head>
              <body>
                <form action="/echo" method="post">
                  <label for="name-field">Имя</label>
                  <input type="text" name="your-name" id="name-field">
                  <div class="half-width">
                    <label for="date-field">Дата рождения</label>
                    <input type="text" class="date" name="date-of-birth" id="date-field">
                  </div>
                  <div class="half-width">
                    <label for="color-field">Цвет</label>
                    <select name="color" id="color-field">
                      <option selected value="redhead">Рыжий</option>
                    </select>
                  </div>
                  <label for="check-mark">
                    <input type="checkbox" name="check" id="check-mark">
                    Разрешать гладить
                  </label>
                  <label for="password-field">Секретное блюдо</label>
                  <input type="password" name="secret-food" id="password-field">
                  <div class="buttons">
                    <input type="submit" value="Сохранить">
                  </div>
                </form>
              </body>
            </html>

#36

Попробуйте вторую строку записать вот так, в одну строку:

<label for="check-mark">
<input type="checkbox" name="check" id="check-mark"> Разрешать гладить</label>  /* в одну строку */
<label for="password-field">Секретное блюдо

#37

Спасибо за ответ! Попробовал сделать так как вы описали, но процент упал до 96. Красным выделилась вся строка.


Код:

<!DOCTYPE html>
<html lang="ru">
  <head>
    <title>Испытание: формы — вспомнить всё</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <form action="/echo" method="post">
      <label for="name-field">Имя</label>
      <input type="text" name="your-name" id="name-field">
      <div class="half-width">
        <label for="date-field">Дата рождения</label>
        <input type="text" class="date" name="date-of-birth" id="date-field">
      </div>
      <div class="half-width">
        <label for="color-field">Цвет</label>
        <select name="color" id="color-field">
          <option selected value="redhead">Рыжий</option>
        </select>
      </div>
      <label for="check-mark">
        <input type="checkbox" name="check" id="check-mark">Разрешать гладить</label>
      <label for="password-field">Секретное блюдо</label>
      <input type="password" name="secret-food" id="password-field">
      <div class="buttons">
        <input type="submit" value="Сохранить">
      </div>
    </form>
  </body>
</html>

#38

Посмотрите внимательно на мой код. Вы пропустили пробел перед “Разрешать…”


#39

Спасибо! Все верно. Теперь 100%.

Только не понятно логическое обоснование пробела в этом месте.


#40

По образцу видно, что checkbox и надпись не вплотную расположены.
Остальные надписи идут с новой строки: каждая в своём блоке.

А, вот логического обоснования форматировать код таким образом здесь точно нет.
Мы просто пытаемся угодить глючной проверке, так же как и в:
Ошибка в курсе: Испытание: редактирование профиля [18/18]