Форма пользовательской формы

Question

У меня есть форма, соответствующая индивидуальной форме. Вопрос в том, как расширить эту форму, если добавит больше входных данных. Я стараюсь:

• формы SVG, SVG, но не может содержать HTML элементы

• CSS клип-путь, но ... Совместимость http://caniuse.com/#search=clip-path

• Фоновое изображение SVG, не работают с фоном -размер, не может масштабироваться до одного направления

• Фоновое изображение PNG/JPG, плохое качество с масштабированием

Answer 1

Плохое качество при масштабировании растрового изображения также зависит от исходного (пиксельного) размера этого изображения. Учитывая тот факт, что это просто большая поверхность с тем же цветом, изображение PNG должно быть довольно маленьким в размере файла, даже в большем масштабе. Например, такая форма на изображении PNG 2000x2000 px займет менее 60 КБ, особенно когда вы применяете PNGCrush.

Другая альтернатива, которую вы можете посмотреть, - это canvas. На холсте вы можете рисовать фигуры самостоятельно. Canvas support намного лучше, чем клип-путь (IE 9+).