2012-05-10 6 views
0

Я использую ASP.NET. До сих пор я всегда использовал таблицы, чтобы вкладывать в них свои ресурсы и иметь все хорошо и хорошо. Но некоторое время назад я читал, что таблицы не для этого. Итак, я хочу знать, каков правильный способ размещения полей ввода на моих веб-формах, но покажите им, что они выглядят красиво, т. Е. Строчная выровненная метка рядом с выровненным слева элементом управления, возможно, более одной строки, и на следующую строку, метки и элементы управления, соответствующие предыдущим элементам управления.Правильный способ ввода данных с помощью HTML

Единственное, что я могу думать один ДИВ на ярлык/контроль, но чувствует себя странно ...

Кроме того, должны быть мои элементы управления внутри <form> тегов? Я никогда их не использовал.

ответ

2

Используйте таблицы, когда это имеет смысл. Форма с столбцом меток и столбцом входов имеет смысл.

Честно говоря, я думаю, что все движение «без стола» стало скорее прихотью, чем чем-либо еще. Я видел, как люди тратили бесчисленные часы, пытаясь воссоздать структуру таблицы с разными тегами HTML, ни по какой другой причине, кроме как сказать, что «они не использовали таблицу». Это просто глупо, зачем воссоздать что-то, что уже работает отлично, как есть?

Проблема с использованием таблиц возникает, когда вы начинаете компоновать свои страницы со столами.Например:

Не делайте этого

<body> 
    <table> 
     <tr class="header"><td><!-- header content --></td></tr> 
     <tr class="content"><td><!-- page content, possibly with a two column table for sidebar --></td></tr> 
     <tr class="footer"><td><!-- footer content --></td></tr> 
    </table> 
</body> 

Использование таблиц для построения формы, однако, имеет смысл.

И да, все элементы управления, относящиеся к вашей форме, должны быть в пределах form тегов.

+0

Что такое использование тегов формы? Просто заявляя, что «здесь идет вход», или что браузеры/серверы что-то делают с этим? –

+1

Тег 'form' помогает браузеру определять, куда отправлять входные элементы (' action'), какие элементы ввода отправлять ('содержащиеся входы") и как отправлять эти элементы ('метод'). Когда нажимается ввод 'submit' или' image', браузер смотрит на элемент родительской формы, чтобы выяснить, что делать. Тег 'form' также пригодится при использовании функции' serialize' jQuery. – jeremysawesome

1

Нет ничего плохого в использовании таблиц для позиционирования элементов. Вы также можете использовать CSS для позиционирования, но тогда вам нужно иметь дело с поддержкой кросс-браузера. Лично я использую таблицы для такого рода вещей.

0

Я думаю, что вы спрашиваете, относится к написанию semantic HTML. <TABLE> теги первоначально предназначались для отображения табличных данных, но были кооптированы для использования в общем макете. Это сохранилось и по сей день, несмотря на то, что HTML и CSS с тех пор выросли, чтобы иметь больше возможностей для макета.

Таблицы легко понять, с их фиксированными сетками. Поплавки могут немного поработать, чтобы понять.

Существует неправильное или неправильное, но многие люди, стремясь написать более семантический HTML, будут использовать теги <ul><li> вокруг своих входов, потому что входы форм можно рассматривать как список в одном смысле.

Что касается использования тегов <FORM>, то с распространенностью AJAX GETS и POSTS теперь они вам не всегда нужны, но я обычно включаю их как средство для создания более семантического кода и улучшения четкости для разработчиков которые следуют, но в качестве контейнера для использования, поэтому я могу обращаться к дочерним входам, когда мне нужно использовать селекторы jQuery (или библиотеки по вашему выбору).

+0

Почему downvote? – RedFilter

0

Таблицы должны использоваться только для отображения табличных данных на веб-страницах. Они не должны использоваться для компоновки.

Вместо этого вы должны использовать теги div для разметки различных элементов вашей страницы. например:

<div class="Labels"> 
    <label for="FullName">Name: *</label> 
</div> 
<div class="Fields"> 
    <input class="text" type="text" name="FullName" id="FullName" /> 
</div> 

Затем вы должны использовать CSS для макета страницы для размещения различных элементов, где вы хотите их на странице, и расположить элементы рядом друг с другом и т.д.

Посмотрите в использовании CSS поплавков если вы новичок в использовании CSS для макета.

Смежные вопросы