Испытание: через тернии к звёздам [28/28]

Курсы §21. Формы, часть 2
24 
<form action="https://echo.htmlacademy.ru/courses" method="post" oninput="daysout.value=days.value">
    <fieldset>
    <legend>Личные данные</legend>
    <div class="half-width">
      <label for="id">ID отзыва</label>
      <input type="number" name="id" value="12345"
      disabled>
      </div>
    <div class="half-width">
      <label for="name">Имя путешественника</label>
      <input type="text" name="name" value="Кекс">
    </div>
    </fieldset>
    <fieldset>
    <legend>Отзыв о поездке</legend>
    <div class="half-width">
      <label for="country">Страна визита</label>
      <input type="text" name="country" value="Норвегия">
    </div>
    <div class="half-width">
      <label for="city">Город</label>
      <select name="towns">
      <option>Осло</option>
      <option>Берн</option>
      <option>Кёльн</option>
      </select>
    </div>
    <div class="half-width">
    <label for="rating">Оценка поездки</label>
      0 <input type="range" min="0" max="10" step="1" 
      id="days" name="days" value="10"> 10
    </div>
    <div class="half-width output-area">
      <output name="daysout">10</output>
    </div>
    <label for="review">Текст отзыва</label>
    <textarea rows="5">Это было просто мяу!</textarea>
    </fieldset>
    <fieldset>
    <legend>Оценка отеля</legend>
    <div class="half-width">
      <label for="hotel">Название отеля</label>
      <input type="text" name="lang" placeholder="Название по-английски">
    </div>
    <div class="half-width">
      <label for="arrival_date">Дата въезда</label>
      <input type="number" name="date" pattern ="[0-9]{2}-[0-9]{2}-[0-9]{4}" placeholder="В формате дд-мм-гггг">
    </div>
    <div class="one-third-width">
      <label for="color">Цвет кроватки</label>
      <input type="color" name="color" id="color" value="#ff0000">
    </div>
    <div class="two-third-width">
      <label for="dish_rating">Оценка обедов</label>
      <select name="marks">
        <option>Подушечки оближешь</option>
        </select>
    </div>
    <label for="fish">Самая вкусная рыба</label>
    <select name="fishes" multiple>
      <option selected>Норвежский лосось</option>
      <option>Зубатка</option>
      <option selected>Морской окунь</option>
      <option>Карась</option>
      <option>Зеркальный карп</option>
      </select>
    </fieldset>
    <div class="buttons">
      <input type="submit" name="mark" value="Оценить">
      <input type="reset" name="reset" value="Сбросить">
    </div>
  </form>

100%

25 
    <div class="half-width">
      <label for="arrival_date">Дата въезда</label>
      <input type="text" id="arrival_date" name="date" pattern="[0-9]{2}-[0-9]{2}-[0-9]{4}" placeholder="В формате дд-мм-гггг">
    </div>

думаю при input type=“text” всплывающее предупреждение срабатывает логичнее чем при input type=“number”

26

29/11/2022 - 100%.
перед выполнением задания - прочтите три конспекта!

 <form action="https://echo.htmlacademy.ru/courses" method="post" oninput="rating1.value=rating.value">
        <fieldset>
        <legend>Личные данные</legend>
        <div class="half-width">
          <label for="id">ID отзыва</label>
          <input type="text" name="text" id="id" value="12345"
          disabled>
        </div>
        <div class="half-width">
          <label for="name">Имя путешественника</label>
          <input type="text" name="name" id="name" value="Кекс">
        </div>
        </fieldset>
        <fieldset>
        <legend>Отзыв о поездке</legend>
        <div class="half-width">
          <label for="country">Страна визита</label>
          <input type="text" name="country" id="counntry" value="Норвегия">
        </div>
        <div class="half-width">
          <label for="city">Город</label>
          
         <select id="city" name="city">
                    <option>Осло</option>
                </select>
          
        </div>
        <div class="half-width">
        <label for="rating">Оценка поездки</label>
        0
      <input type="range" name="rating" id="rating" min="0" max="10"  value="10">
        10
        </div>
        <div class="half-width output-area">
         <output name="rating1">10</output>
        </div>
        <label for="review">Текст отзыва</label>
        
        <textarea name="review" id="review" rows="5">Это было просто мяу!</textarea>
        
        </fieldset>
        <fieldset>
          
          <legend>Оценка отеля</legend>
        <div class="half-width">
          <label for="hotel">Название отеля</label>
          <input type="text" name="hotel" id="hotel" placeholder="Название по-английски">
        </div>
        <div class="half-width">
          <label for="arrival_date">Дата въезда</label>
          <input type="text" name="arrival_date" id="arrival_date" placeholder="В формате дд-мм-гггг">
        </div>
        <div class="one-third-width">
          <label for="color">Цвет кроватки</label>
          <input type="color" name="color" id="color" value="#ff0000">
        </div>
        <div class="two-third-width">
          <label for="dish_rating">Оценка обедов</label>
          
          <select id="dish_rating" name="city">
                    <option>Подушечки оближешь</option>
                </select>
                
          </div>
        <label for="fish">Самая вкусная рыба</label>
        
        <select name="fish" multiple>
          <option selected>Норвежский лосось</option>
          <option>Зубатка</option>
          <option selected>Морской окунь</option>
          <option>Карась</option>
          <option>Зеркальный карп</option>
          </select>
          </fieldset>
          
        <div class="buttons">
          
          <input type="submit" value="Оценить">
          <input type="reset" value="Сбросить">
          
        </div>
      </form>