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

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 informasi selengkapnya, lihat Toolbox.

Input (Tombol)

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">

Masukan (Atur Ulang)

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)

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)

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.

Masukan (File)

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)

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. 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)

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">

Masukan (Radio)

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)

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">

Area teks

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.

Tabel

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

img Menyisipkan elemen. Edit elemen ini untuk menentukan dan teksnya srcalt .

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

<img alt="" src="">

Pilih

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

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

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>

Lihat juga

• Kotak Alat