Bagikan melalui


Kotak Alat, tab HTML

Tab HTML kotak Alat menyediakan komponen yang berguna di halaman web dan formulir web. Untuk melihat tab ini, pertama-tama buka dokumen untuk diedit di perancang HTML. Pada menu Tampilan, klik Kotak Alat, lalu klik tab HTML kotak Alat.

Untuk membuat instans alat pada tab HTML , klik dua kali alat untuk menambahkannya ke dokumen Anda pada titik penyisipan saat ini, atau pilih alat dan seret ke posisi yang diinginkan pada permukaan pengeditan.

Elemen antarmuka pengguna

Alat berikut ini tersedia secara default pada tab HTML.

Pointer

ASP.NET Mobile Designer HTMLpage Pointer

Alat ini dipilih secara default ketika tab Kotak Alat terbuka. Ini tidak dapat dihapus. Penunjuk memungkinkan Anda menyeret objek ke permukaan tampilan Desain, mengubah ukurannya, dan memposisikannya kembali di halaman atau formulir. Untuk mengetahui informasi selengkapnya, lihat Kotak alat.

Input (Tombol)

HTML web page button

input Menyisipkan elemen .type="button" Untuk mengubah teks yang ditampilkan, edit name properti . Secara default, id="Button1" disisipkan untuk tombol pertama, id="Button2" untuk yang kedua, dan sebagainya.

Saat Anda menyeret Input (Tombol) ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Input (Reset)

HTMLpageResetButton screenshot

input Menyisipkan elemen .type="reset" Untuk mengubah teks yang ditampilkan, edit name properti . Secara default, id="Reset1" disisipkan untuk tombol reset pertama, id="Reset2" untuk yang kedua, dan sebagainya.

Saat Anda menyeret Input (Reset) ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Input (Kirim)

HTMLpageToolbarSubmitButton screenshot

input Menyisipkan elemen .type="submit" Untuk mengubah teks yang ditampilkan, edit name properti . Secara default, id="Submit1" disisipkan untuk tombol kirim pertama, id="Submit2" untuk yang kedua, dan sebagainya.

Saat Anda menyeret Input (Kirim) ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Input (Teks)

HTMLpageToolbarTextField screenshot

input Menyisipkan elemen type="text" dalam dokumen Anda. Untuk mengubah teks default yang ditampilkan, edit value atribut . Secara default, id="Text1" disisipkan untuk bidang teks pertama, id="Text2" untuk yang kedua, dan sebagainya.

Saat Anda menyeret Input (Teks) ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Penting

Disarankan agar Anda memvalidasi semua input pengguna. Untuk informasi selengkapnya, lihat Memvalidasi Input Pengguna di Situs Halaman Web (Razor) ASP.NET.

Input (File)

HTML page File Field

input Menyisipkan elemen type="file" dalam dokumen Anda. Secara default, id="File1" disisipkan untuk bidang file pertama, id="File2" untuk yang kedua, dan sebagainya.

Saat Anda menyeret Input (File) ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Penting

Disarankan agar Anda memvalidasi semua input pengguna. Untuk informasi selengkapnya, lihat Memvalidasi Input Pengguna di Situs Halaman Web (Razor) ASP.NET.

Input (Kata Sandi)

Visual Studio Password Field

input Menyisipkan elemen .type="password" Secara default, id="Password1" disisipkan untuk bidang kata sandi pertama, id="Password2" untuk yang kedua, dan sebagainya.

Saat Anda menyeret Input (Kata Sandi) ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Penting

Jika aplikasi Anda mengirimkan nama pengguna dan kata sandi, Anda harus mengonfigurasi situs web Anda untuk menggunakan Secure Sockets Layer (SSL) untuk mengenkripsi transmisi. Untuk informasi selengkapnya, lihat Mengamankan Koneksi ion. Selain itu, disarankan agar Anda memvalidasi semua input pengguna. Untuk informasi selengkapnya, lihat Memvalidasi Input Pengguna di Situs Halaman Web (Razor) ASP.NET.

Input (Kotak centang)

HTML webpage Toolbox Checkbox Option

input Menyisipkan elemen .type="checkbox" Untuk mengubah teks yang ditampilkan, edit name properti . Secara default, id="Checkbox1" disisipkan untuk kotak centang pertama, id="Checkbox2" untuk yang kedua, dan sebagainya.

Saat Anda menyeret Input (kotak centang) ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Input (Radio)

VisualStudioHTMLpageRadioButton screenshot

input Menyisipkan elemen .type="radio" Untuk mengubah teks yang ditampilkan, edit name properti . Secara default, id="Radio1" disisipkan untuk tombol radio pertama, id="Radio2" untuk yang kedua, dan sebagainya.

Saat Anda menyeret Input (Radio) ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Input (Tersembunyi)

HTML page Hidden Item

input Menyisipkan elemen .type="hidden" Secara default, id="Hidden1" disisipkan untuk bidang tersembunyi pertama, id="Hidden2" untuk yang kedua, dan sebagainya.

Saat Anda menyeret Input (Tersembunyi) ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Textarea

HTMLpage Toolbar Text Area

textarea Menyisipkan elemen. Anda dapat mengubah ukuran area teks, atau menggunakan bilah gulirnya untuk melihat teks yang meluas di luar area tampilannya. Untuk mengubah teks default yang ditampilkan, edit value atribut . Secara default, id="textarea1" disisipkan area teks pertama, id=" textarea 2" untuk yang kedua, dan sebagainya.

Saat Anda menyeret Textarea ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Penting

Disarankan agar Anda memvalidasi semua input pengguna. Untuk informasi selengkapnya, lihat Memvalidasi Input Pengguna di Situs Halaman Web (Razor) ASP.NET.

Table

HTMLpageToolbarTable screenshot

table Menyisipkan elemen.

Saat Anda menyeret Tabel ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Gambar

HTML page Image Item

img Menyisipkan elemen. Edit elemen ini untuk menentukan dan teksnya src alt .

Saat Anda menyeret Gambar ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

<img alt="" src="">

Pilih

HTML page Toolbox Dropdown

Menyisipkan elemen dropdown select (tanpa size atribut). Secara default, id="select1" disisipkan untuk kotak daftar pertama, id="select2" untuk yang kedua, dan sebagainya.

Saat Anda menyeret Pilih ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Anda dapat membuat elemen multibaris select dengan meningkatkan nilai properti ukuran.

Aturan Horizontal

HTML page Horizontal Rule Item

hr Menyisipkan elemen. Untuk meningkatkan ketebalan garis, edit size atribut .

Saat Anda menyeret Aturan Horizontal ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Div

HTML page Label

div Menyisipkan elemen yang menyertakan ms_positioning="FlowLayout" atribut. Kecuali untuk lebar dan tinggi, item ini identik dengan Panel Tata Letak Alur. Untuk memformat teks yang terkandung dalam div elemen , tambahkan class="stylename" atribut ke tag pembuka.

Saat Anda menyeret Div ke permukaan tampilan Desain, markup HTML seperti berikut ini disisipkan ke dalam dokumen Anda:

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

Baca juga