Недавние проекты включают в себя много производства форм, особенно флажок и радио коробки. Тем не менее, в процессе разработки переднего оборудования было обнаружено, что отдельные (сложные) флажки и быстрый текст, стоящий за ними, не могут быть выровнены без каких-либо настроек, и между Firefox и IE была большая разница. Даже если вертикальная атака: средняя установлена, он все равно не может быть полностью выровнен. Как показано на рисунке ниже:
Поэтому я проверил некоторые веб -сайты в Интернете и обнаружил, что эта проблема распространена, как показано на рисунке ниже (FF3.5):
На многих веб -сайтах существует проблема, что элементы формы не могут быть выровнены с быстрым текстом. Поэтому я планирую изучить эту проблему. Во-первых, я искал статью «Все говорят, что все по вертикально-авативам» старшим пшеничным. В своей статье Уитли упомянул несколько ключевых моментов о вертикальном центрировании:
1. Когда вертикально-входная: середина, центр элемента выровнен с центром окружающих элементов.
2. Определение центра здесь: изображение, конечно, половина высоты, и текст должен быть перемещен на 0,5EX в зависимости от базовой линии, то есть в центре строчной буквы x. Тем не менее, многие браузеры часто определяют единицу бывшего как 0,5 эм, поэтому это не обязательно центр x (если вы не понимаете существительные, такие как базовая линия, сначала прочитайте статью Wheatlee)
Согласно этой идее, по сравнению с проблемами, с которыми я столкнулся, первое, что приходит на ум, - это проверить, использует ли браузер те же правила для флажков и изображений для отображения (независимо от того, рассматриваете ли вы флажок как квадратный картинку). Итак, я написал следующий код:
<style>
Body {font-size: 12px;}
</style>
<стиль ввода = вертикальный класс: средний; name = test type = флажок>
<img style = вертикальный класс: средний; src = testpic.gif />
Тестовый текст
Testpic.gif в коде - это черное изображение с точно таким же размером, что и флажок. Следующее отображается в соответствии с FF3.5:
Предыдущая страница 1 2 3 4 Следующая страница Прочитайте полный текст