 
        
        - •34. Проектирование, компоновка и представление форм с помощью css
- •Концепции, представленные в этой статье
- •Переопределение правил и маркеров
- •Новые элементы полей формы
- •Изменения относительно предыдущей формы
- •Очевидные недостатки
- •Новые поля форм? Что это?
- •Когда слишком много вариантов выбора: select/option
- •Объединение последовательности элементов управления: fieldset
- •Начинаем с самого начала, заканчиваем готовой формой
- •Демонстрация 1
- •Демонстрация 1: сопутствующие рассмотрения
- •Демонстрация 2
- •Демонстрация 2: сопутствующие рассмотрения
- •Демонстрация 3
- •Демонстрация 3: сопутствующие рассмотрения
- •Создание сетки
- •Создание структуры сетки в композиции
- •Реализация сетки в таблице стилей
- •Демонстрация 4
- •Демонстрация 4: сопутствующие рассмотрения
- •Правило третей
- •Демонстрация 5
- •Демонстрация 5: сопутствующие рассмотрения
- •Демонстрация 6
- •Демонстрация 6: сопутствующие рассмотрения
- •Демонстрация 7
- •Демонстрация 8
- •Демонстрация 8: сопутствующие рассмотрения
- •Демонстрация 9
- •Демонстрация 9: сопутствующие рассмотрения
- •Демонстрация 10
- •Демонстрация 10: сопутствующие рассмотрения
- •Демонстрация 11
- •Демонстрация 11: сопутствующие рассмотрения
- •Демонстрация 12
- •Демонстрация 12: сопутствующие рассмотрения
- •Создание уровней поддержки платформы
- •Сложные компоновки форм на практике (… вместо теории)
- •Заключение
- •Контрольные вопросы
- •Библиография
- •Об авторе
Контрольные вопросы
- Какой тип обтекания у элементов управления формы, которые принимают ввод пользователя, и какие две характеристики делают их выделяющимися в отношении компоновки? 
- Какие два атрибута отличные от value и disabled управляют настройками элементов управления формы до взаимодействия пользователя, и к каким элементам они применяются? 
- Документ демонстрации обеспечивает требуемые поля. Напишите, по крайней мере, одно правило таблицы стилей, которое будет разом изменять внешний вид поля, которое содержит образец ошибки или пропуск ввода пользователя. 
- Опишите по одному случаю использования для каждого из элементов управления select, checkbox, и radio. Обоснуйте каждое описание объяснением преимуществ, которое предоставляет сделанный выбор, при сравнении с другими возможными вариантами выбора. 
- Используя сетевую ссылку, выбранную инструктором, найдите и кратко опишите альтернативы для input type="submit". 
- Создайте элемент select, который позволяет выбрать несколько options, добавляя пару атрибут/значение multiple="multiple". После анализа поведения этого элемента, объясните, почему он редко встречается на производственных сайтах. 
Таблица: преобразование простых дробей в десятичные
В следующей таблице цифры, находящиеся в скобках со звездочкой после них, бесконечно повторяются; например, 0.2(6*) эквивалентно 0.266666666666666… (6 повторяется бесконечно).
Ближайшие к нулю значения находятся в таблице слева, и приближаются к единице в таблице при движении слева направо.
| x | 1/x | 2/x | 3/x | 4/x | 5/x | 6/x | 7/x | 8/x | 9/x | 10/x | 11/x | 12/x | 13/x | 14/x | 15/x | 
| 2 | .5 | - | - | - | - | - | - | - | - | - | - | - | - | - | - | 
| 3 | .(3*) | .(6*) | - | - | - | - | - | - | - | - | - | - | - | - | - | 
| 4 | .25 | .5 | .75 | - | - | - | - | - | - | - | - | - | - | - | - | 
| 5 | 
 | .4 | .6 | .8 | - | - | - | - | - | - | - | - | - | - | - | 
| 6 | .1.(6*) | ..3*) | .5 | .(6*) | .8(3*) | - | - | - | - | - | - | - | - | - | - | 
| 7 | .(142857*) | .(285714*) | .(428571*) | .(571428*) | .(714285*) | .(857142*) | - | - | - | - | - | - | - | - | - | 
| 8 | .125 | .25 | .375 | .5 | .625 | .75 | .875 | - | - | - | - | - | - | - | - | 
| 9 | .(1*) | .(2*) | .(3*) | .(4*) | .(5*) | .(6*) | .(7*) | .(8*) | - | - | - | - | - | - | - | 
| 10 | .1 | .2 | .3 | .4 | .5 | .6 | .7 | .8 | .9 | - | - | - | - | - | - | 
| 11 | .(09*) | .(18*) | .(27*) | .(36*) | .(45*) | .(54*) | .(63*) | .(72*) | .(81*) | .(90*) | - | - | - | - | - | 
| 12 | .08(3*) | .1(6*) | .25 | .(3*) | .41(6*) | .5 | .58(3*) | .(6*) | .75 | .8(3*) | .91(6*) | - | - | - | - | 
| 13 | .(076923*) | .(153846*) | .(230769*) | .(307692*) | .(384615*) | .(461538*) | .(538461*) | .(615383*) | .(692307*) | .(769230*) | .(846153*) | .(923076*) | - | - | - | 
| 14 | .0(714285*) | .(142857*) | .2(142857*) | .(285714*) | .3(571428*) | .(428571*) | .5 | .5(714285*) | .6(428571*) | .(714285*) | .7(857142*) | .(857142*) | .9(285714*) | - | - | 
| 15 | .0(6*) | .1(3*) | .2 | .2(6*) | .(3*) | .4 | .4(6*) | .5(3*) | .6 | .(6*) | .7(3*) | .8 | .8(6*) | .9(3*) | - | 
| 16 | .0625 | .125 | .1875 | .25 | .3125 | .375 | .4375 | .5 | .625 | .625 | .6875 | .75 | .8125 | .857 | .9375 | 
