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 mengetahui informasi selengkapnya, lihat Kotak alat.
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">
Input (Reset)
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.
Input (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 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)
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)
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">
Textarea
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
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 src
alt
.
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>