Поделиться через


Вкладка HTML, панель элементов

Вкладка HTML панели элементов предоставляет компоненты, которые полезны для использования на веб-страницах и веб-формах. Для просмотра этой вкладки сначала откройте HTML-документ в конструкторе HTML. В меню Вид щелкните Панель элементов и откройте вкладку HTML на панели элементов.

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

Элементы пользовательского интерфейса

По умолчанию на вкладке HTML доступны указанные ниже средства.

Указатель

ASP.NET Mobile Designer HTMLpage Pointer

Это средство выбирается по умолчанию при открытии любой вкладки области элементов. Его нельзя удалить. Указатель позволяет перетаскивать объекты на поверхность конструктора, изменять их размеры и перемещать по странице или форме. См. дополнительные сведения о панели элементов.

Ввод (кнопка)

HTML web page button

Вставляет элемент input объекта type="button". Чтобы изменить отображаемый текст, измените свойство name. По умолчанию id="Button1" вставляется для первой кнопки, id="Button2" для второй и т. д.

Когда вы перетаскиваете элемент Ввод (кнопка) на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<input id="Button1" type="button" value="Button" name="Button1">

Ввод (кнопка сброса)

HTMLpageResetButton screenshot

Вставляет элемент input объекта type="reset". Чтобы изменить отображаемый текст, измените свойство name. По умолчанию id="Reset1" вставляется для первой кнопки сброса, id="Reset2" для второй и т. д.

Когда вы перетаскиваете элемент Ввод (кнопка сброса) на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<input id="Reset1" type="reset" value="Reset" name="Reset1">

Ввод (кнопка отправки)

HTMLpageToolbarSubmitButton screenshot

Вставляет элемент input объекта type="submit". Чтобы изменить отображаемый текст, измените свойство name. По умолчанию id="Submit1" вставляется для первой кнопки отправки, id="Submit2" для второй и т. д.

Когда вы перетаскиваете элемент Ввод (кнопка отправки) на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<input id="Submit1" type="submit" value="Submit" name="Submit1">

Ввод (текст)

HTMLpageToolbarTextField screenshot

Вставляет элемент input объекта type="text" в документ. Чтобы изменить отображаемый текст по умолчанию, измените атрибут value. По умолчанию id="Text1" вставляется для первого текстового поля, id="Text2" для второго и т. д.

Когда вы перетаскиваете элемент Ввод (текст) на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<input id="Text1" TYPE="text" value="Text Field" name="Text1">

Важно!

Рекомендуется проверить весь пользовательский ввод. Дополнительные сведения см. в статье Validating User Input in ASP.NET Web Pages (Razor) Sites.

Ввод (файл)

HTML page File Field

Вставляет элемент input объекта type="file" в документ. По умолчанию id="File1" вставляется для первого поля файла, id="File2" для второго и т. д.

Когда вы перетаскиваете элемент Ввод (файл) на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<input id="File1" type="file" name="File1">

Важно!

Рекомендуется проверить весь пользовательский ввод. Дополнительные сведения см. в статье Validating User Input in ASP.NET Web Pages (Razor) Sites.

Ввод (пароль)

Visual Studio Password Field

Вставляет элемент input объекта type="password". По умолчанию id="Password1" вставляется для первого поля пароля, id="Password2" для второго и т. д.

Когда вы перетаскиваете элемент Ввод (пароль) на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<input id="Password1" type="password" name="Password1">

Важно!

Если приложение передает имена пользователей и пароли, следует настроить веб-сайт, чтобы использовать SSL для шифрования передачи. Подробнее см. в разделе Защита подключений. Дополнительно рекомендуется проверить весь пользовательский ввод. Дополнительные сведения см. в статье Validating User Input in ASP.NET Web Pages (Razor) Sites.

Ввод (флажок)

HTML webpage Toolbox Checkbox Option

Вставляет элемент input объекта type="checkbox". Чтобы изменить отображаемый текст, измените свойство name. По умолчанию id="Checkbox1" вставляется для первого флажка, id="Checkbox2" для второго и т. д.

Когда вы перетаскиваете элемент Ввод (флажок) на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<input id="Checkbox1" type="checkbox" name="Checkbox1">

Ввод (переключатель)

VisualStudioHTMLpageRadioButton screenshot

Вставляет элемент input объекта type="radio". Чтобы изменить отображаемый текст, измените свойство name. По умолчанию id="Radio1" вставляется для первого переключателя, id="Radio2" для второго и т. д.

Когда вы перетаскиваете элемент Ввод (переключатель) на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<input id="Radio1" type="radio" name="Radio1">

Ввод (скрытое поле)

HTML page Hidden Item

Вставляет элемент input объекта type="hidden". По умолчанию id="Hidden1" вставляется для первого скрытого поля, id="Hidden2" для второго и т. д.

Когда вы перетаскиваете элемент Ввод (скрытое поле) на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<input id="Hidden1" type="hidden" name="Hidden1">

Текстовая область

HTMLpage Toolbar Text Area

Вставляет элемент textarea. Можно изменить размер текстовой области или с помощью полос прокрутки просматривать текст, выходящий за пределы области отображения. Чтобы изменить отображаемый текст по умолчанию, измените атрибут value. По умолчанию id="textarea1" вставляется для первой текстовой области, id=" textarea 2" для второй и т. д.

Когда вы перетаскиваете элемент Текстовая область на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<textarea id=" textarea 1 name=" textarea 1" rows=2 cols=20></textarea>

Важно!

Рекомендуется проверить весь пользовательский ввод. Дополнительные сведения см. в статье Validating User Input in ASP.NET Web Pages (Razor) Sites.

Таблицу

HTMLpageToolbarTable screenshot

Вставляет элемент table.

Когда вы перетаскиваете элемент Таблица на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<table cellspacing="1" width="75%" border=1> <tr><td></td></tr></table>

Изображение

HTML page Image Item

Вставляет элемент img. Измените этот элемент, чтобы указать его src и текст alt.

Когда вы перетаскиваете элемент Изображение на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<img alt="" src="">

Select

HTML page Toolbox Dropdown

Вставляет элемент select раскрывающегося списка (без атрибута size). По умолчанию id="select1" вставляется для первого списка, id="select2" для второго и т. д.

Когда вы перетаскиваете элемент Выбрать на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<select id="select1" name="select1"><option selected></option></select>

Можно создать многострочный элемент select, увеличивая значение свойства размера.

Горизонтальная линия

HTML page Horizontal Rule Item

Вставляет элемент hr. Для увеличения толщины линии измените атрибут size.

Когда вы перетаскиваете элемент Горизонтальная линия на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<hr width="100%" size=1>

ДИВ

HTML page Label

Вставляет элемент div, включающий атрибут ms_positioning="FlowLayout". За исключением ширины и высоты, этот элемент аналогичен панели потокового макета. Чтобы форматировать текст, содержащийся в элементе div, добавьте атрибут class="stylename" в открывающий тег.

Когда вы перетаскиваете элемент ДИВ на поверхность конструктора, в документ вставляется следующая HTML-разметка:

<div ms_positioning="FlowLayout" style="width: 70px; position: relative; height: 15px">Label</div>

См. также