Jika Anda melakukan bisnis di Internet, meluangkan waktu untuk belajar bagaimana merancang situs web Anda sendiri dan menulis kode Anda sendiri HTML (hypertext markup language) akan memainkan peran utama dalam keberhasilan Anda. Tidak hanya akan belajar HTML coding menyediakan Anda dengan kebebasan untuk memperbarui dokumen Anda HTML, tetapi juga akan menghemat banyak uang, karena anda akan dapat menghindari untuk menyewa seorang desainer web profesional.
Jika Anda mencari beberapa tag HTML untuk membumbui situs web Anda, Anda telah datang ke tempat yang tepat. Anda akan menemukan berbagai kode HTML dan tips untuk membantu Anda di bawah ini.
Namun, sebelum meninjau tag HTML, jika Anda baru untuk HTML dan desain situs web, bagian berikut akan membantu Anda dalam menciptakan halaman web HTML. Untuk situs web informasi desain tambahan, pastikan Anda tidak ketinggalan artikel desain web dan tutorial di bagian bawah halaman ini.
Jika Anda mencari beberapa tag HTML untuk membumbui situs web Anda, Anda telah datang ke tempat yang tepat. Anda akan menemukan berbagai kode HTML dan tips untuk membantu Anda di bawah ini.
Namun, sebelum meninjau tag HTML, jika Anda baru untuk HTML dan desain situs web, bagian berikut akan membantu Anda dalam menciptakan halaman web HTML. Untuk situs web informasi desain tambahan, pastikan Anda tidak ketinggalan artikel desain web dan tutorial di bagian bawah halaman ini.
Membuat Halaman HTML
Sebuah halaman web dibuat menggunakan bahasa disebut, Hypertext Markup Language, lebih dikenal sebagai Code. Anda dapat menulis kode Anda sendiri dalam editor teks biasa, seperti Catatan Pad, atau menggunakan editor HTML, yang akan menulis kode untuk Anda.
Kode HTML, juga disebut sebagai tag HTML, diapit oleh kurang dari (<) dan lebih besar dari (>) kurung dan dapat ditulis dalam modal atau huruf kecil.
Braket pembukaan diikuti oleh unsur, yang merupakan perintah browser, dan diakhiri dengan kurung tutup.
<Font size = 2>
Sebuah elemen juga dapat diikuti oleh atribut, yang adalah kata-kata yang menjelaskan sifat-sifat elemen, dan selanjutnya menginstruksikan browser.
<font ukuran =2>
Atribut hanya terkandung dalam tag HTML membuka di sebelah kanan elemen dan dipisahkan oleh spasi dan diikuti dengan tanda (=) sama.
Nilai ini mengikuti tanda sama dan ditutupi dalam tanda kutip.
<font size= 2>
Kode HTML, juga disebut sebagai tag HTML, diapit oleh kurang dari (<) dan lebih besar dari (>) kurung dan dapat ditulis dalam modal atau huruf kecil.
Braket pembukaan diikuti oleh unsur, yang merupakan perintah browser, dan diakhiri dengan kurung tutup.
<Font size = 2>
Sebuah elemen juga dapat diikuti oleh atribut, yang adalah kata-kata yang menjelaskan sifat-sifat elemen, dan selanjutnya menginstruksikan browser.
<font ukuran =2>
Atribut hanya terkandung dalam tag HTML membuka di sebelah kanan elemen dan dipisahkan oleh spasi dan diikuti dengan tanda (=) sama.
Nilai ini mengikuti tanda sama dan ditutupi dalam tanda kutip.
<font size= 2>
Dasar HTML Dokumen Kode Struktur
Mulailah menulis tag HTML Anda dengan membuat tata letak dasar dokumen Anda. Salin dan sisipkan kode ini ke dalam teks atau editor HTML.
| <html> <head> <title> Judul Halaman Anda </ title> </ Head> <body> Daerah ini akan berisi segala sesuatu yang akan terlihat melalui browser web, seperti teks dan grafis. Semua informasi akan HTML kode. Untuk daftar lengkap kode HTML, tag dan contoh, lihat tabel HTML di bawah ini. </ Body> </ Html> |
<html> - Dimulai HTML Anda dokumen.
<head> - Berisi informasi tentang halaman seperti TITLE, META tag untuk Search Engine pengindeksan yang tepat, tag STYLE, yang menentukan tata letak halaman, dan JavaScript coding untuk efek khusus.
<title> - The TITLE halaman. Ini akan terlihat dalam judul bar dari browser pemirsa.
</ Title> - Menutup <title> tag HTML.
</ Head> - Menutup <head> tag HTML.
<body> - Ini adalah di mana Anda akan mulai menulis dokumen Anda dan menempatkan kode HTML Anda.
</ Body> - Menutup <body> tag HTML.
</ Html> - Menutup tag <html>.
<head> - Berisi informasi tentang halaman seperti TITLE, META tag untuk Search Engine pengindeksan yang tepat, tag STYLE, yang menentukan tata letak halaman, dan JavaScript coding untuk efek khusus.
<title> - The TITLE halaman. Ini akan terlihat dalam judul bar dari browser pemirsa.
</ Title> - Menutup <title> tag HTML.
</ Head> - Menutup <head> tag HTML.
<body> - Ini adalah di mana Anda akan mulai menulis dokumen Anda dan menempatkan kode HTML Anda.
</ Body> - Menutup <body> tag HTML.
</ Html> - Menutup tag <html>.
Cara Copy dan Paste Kode HTML
Untuk menyalin dan menyisipkan tag HTML / kode dari tabel HTML di bawah ini ke dalam HTML halaman web Anda, tempatkan pointer mouse ke awal kode HTML yang ingin Anda salin. Selanjutnya, klik dan tahan tombol kiri mouse dan tarik mouse anda ke atas semua kode HTML yang Anda ingin menyalin (Contoh teks yang disorot). Kode HTML Anda sekarang harus disorot. Klik "Edit" - "Copy" pada toolbar web browser Anda dan menempatkan kursor Anda dalam kode HTML di mana Anda ingin menempatkan kode. Klik kanan pada mouse anda dan pergi ke "Tempel." Kode HTML Anda sekarang harus menampilkan dalam dokumen HTML Anda.
Kode HTML Bagan
Untuk menggunakan salah satu kode HTML berikut, cukup pilih tag HTML yang ingin dan copy dan paste ke halaman web Anda.
Nama | |||||||||||||||
| HTML Komentar | <! - | <- Ini dapat dilihat di bagian HTML dari dokumen -> | Tidak ada yang akan menunjukkan (Tips) | ||||||||||||
| HTML Jangkar | <A - | <a href= "http://www.domain.com/"> Kunjungi Situs Kami </ a> | Kunjungi Situs Kami (Tips) | ||||||||||||
| HTML Bold | <b> | <b> Contoh </ b> | Contoh | ||||||||||||
| HTML Besar (Teks) | <big> | <big> Contoh </ big> | Contoh (Tips) | ||||||||||||
| Tubuh HTML Document | <body> | <body> Isi dari halaman HTML Anda </ body> | Isi dari halaman web Anda (Tips) | ||||||||||||
| HTML Line Break | <br> | Isi <br> halaman Anda Isi dari halaman Anda | Isi dari halaman web Anda Isi dari halaman web Anda | ||||||||||||
| HTML Pusat | <center> | <center> ini pusat akan isi Anda </ center> | Pusat ini akan isi Anda | ||||||||||||
| HTML Definisi Deskripsi | <dd> | <dl> <dt> Definisi Istilah </ dt> <dd> Definisi dari istilah </ dd> <dt> Definisi Istilah </ dt> <dd> Definisi dari istilah </ dd> </ Dl> |
| ||||||||||||
| HTML Definisi Daftar | <dl> | <dl> <dt> Definisi Istilah </ dt> <dd> Definisi dari istilah </ dd> <dt> Definisi Istilah </ dt> <dd> Definisi dari istilah </ dd> </ Dl> |
| ||||||||||||
| HTML Definisi Istilah | <dt> | <dl> <dt> Definisi Istilah </ dt> <dd> Definisi istilah </ dd> <dt> Definisi Istilah </ dt> <dd> Definisi dari istilah </ dd> </ Dl> |
| ||||||||||||
| Penekanan HTML | <em> | Ini adalah Contoh <em> </ em> menggunakan tag penekanan | Ini adalah contoh penggunaan tag penekanan | ||||||||||||
| HTML Embed Obyek | <embed> | <embed src="yourfile.mid" width="100%" height="60" align="center"> | (Tips) | ||||||||||||
| HTML Embed Obyek | <embed> | <Embed src = "yourfile.mid" autostart = "true" tersembunyi = "false" loop = "false"> <noembed> <bgsound src="yourfile.mid" loop="1"> </ noembed> | Musik akan mulai diputar saat halaman dibuka dan hanya akan bermain satu kali. Sebuah panel kontrol akan ditampilkan untuk memungkinkan pengunjung Anda untuk menghentikan musik. | ||||||||||||
| HTML Font | <font> | <font face="Times New Roman"> Contoh </ font> | Contoh (Tips) | ||||||||||||
| HTML Font | <font> | <font face="Times New Roman" size="4"> Contoh </ font> | Contoh (Tips) | ||||||||||||
| HTML Font | <font> | <font face="Times New Roman" size="+3" color="#ff0000"> Contoh </ font> | Contoh (Tips) | ||||||||||||
| HTML Formulir | <form> | <form action="mailto:you@yourdomain.com"> Nama: <input name="Name" value="" size="10"> <br> Email: <input name="Email" value="" size="10"> <br> <center> <input type="submit"> </ center> </ Form> | |||||||||||||
| HTML Heading 1 HTML Heading 2 HTML Heading 3 HTML Heading 4 HTML Heading 5 HTML Heading 6 | <h1> <h2> <h3> <h4> <h5> <h6> | <h1> Heading 1 Contoh </ h1> <h2> Heading 2 Contoh </ h2> <h3> Heading 3 Contoh </ h3> <h4> Pos 4 Contoh </ h4> <h5> Pos 5 Contoh </ h5> <h6> Heading 6 Contoh </ h6> |  | ||||||||||||
| Sundulan dari HTML Document | <head> | <head> Mengandung elemen menggambarkan dokumen </ head> | Tidak ada yang akan menampilkan | ||||||||||||
| HTML Horizontal Peraturan | <hr> | <hr /> | Isi dari halaman web Anda (Tips) Isi dari halaman web Anda | ||||||||||||
| HTML Horizontal Peraturan | <hr> | <hr width="50%" size="3" /> | Isi dari halaman web Anda Isi dari halaman web Anda | ||||||||||||
| HTML Horizontal Peraturan | <hr> | <hr width="50%" size="3" noshade /> | Isi dari halaman web Anda Isi dari halaman web Anda | ||||||||||||
| HTML Horizontal Peraturan | <hr> (Internet Explorer) | <Hr width = "75%" color = " # ff0000 "size =" 4 "/> | Isi dari halaman web Anda Isi dari halaman web Anda | ||||||||||||
| HTML Horizontal Peraturan | <hr> (Internet Explorer) | <Hr width = "25%" color = " # 6699ff "size =" 6 "/> | Isi dari halaman web Anda Isi dari halaman web Anda | ||||||||||||
| HTML Hypertext Markup Language | <html> | <html> <head> <META> <title> Judul dari halaman web Anda </ title> </ Head> <body> web isi halaman HTML </ Body> </ Html> | Isi dari halaman web Anda | ||||||||||||
| HTML Miring | <i> | <i> Contoh </ i> | Contoh | ||||||||||||
| HTML Gambar | <img> | <img src="Earth.gif" width="41" height="41" border="0" alt="text menggambarkan image" /> |  (Tips) | ||||||||||||
| HTML Masukan Lapangan | <input> | Contoh 1: <form method=post action="/cgi-bin/example.cgi"> <input type="text" size="10" maxlength="30"> <input type="submit" value="Submit"> </ Form> | |||||||||||||
| HTML Masukan Lapangan | <input> (Internet Explorer) | Contoh 2: <form method=post action="/cgi-bin/example.cgi"> <Input type = "text" style = "color: # ffffff; font-family: Verdana; font-weight: bold; font-size: 12px; background-color: # 72a4d2;" size = "10" MaxLength = "30 "> <input type="submit" value="Submit"> </ Form> | |||||||||||||
| HTML Masukan Lapangan | <input> | Contoh 3: <form method=post action="/cgi-bin/example.cgi"> <table border="0" cellspacing="0" cellpadding="2"> <tr> <td bgcolor="#8463ff"> <input type="text" size="10" maxlength="30"> </ td> <td bgcolor="#8463ff" valign="Middle"> <input type="image" name="submit" src="yourimage.gif"> </ td> </ tr> </ table> </ Form> | |||||||||||||
| HTML Masukan Lapangan | <input> | Contoh 4: <form method=post action="/cgi-bin/example.cgi"> Masukkan Komentar Anda: <br> <textarea wrap="virtual" name="Comments" rows=3 cols=20 maxlength=100> </ textarea> <br> <input type="submit" value="Submit"> <input type="Reset" value="Clear"> </ Form> | |||||||||||||
| HTML Masukan Lapangan | <input> | Contoh 5: <form method=post action="/cgi-bin/example.cgi"> <center> Pilih opsi: <select> <option> opsi 1 </ option> <option dipilih> opsi 2 </ option> <option> pilihan 3 </ option> <option> opsi 4 </ option> <option> pilihan 5 </ option> <option> pilihan 6 </ option> </ Select> <br> <input type="submit" value="Submit"> </ center> </ Form> | |||||||||||||
| HTML Masukan Lapangan | <input> | Contoh 6: <form method=post action="/cgi-bin/example.cgi"> Pilih opsi: <br> <input type="radio" name="option"> Opsi 1 <input type="radio" name="option" checked> Opsi 2 <input type="radio" name="option"> Opsi 3 <br> <br> Pilih opsi: <br> <input type="checkbox" name="selection"> Seleksi 1 <input type="checkbox" name="selection" checked> Seleksi 2 <input type="checkbox" name="selection"> Seleksi 3 <input type="submit" value="Submit"> </ Form> | |||||||||||||
| HTML Daftar Barang | <li> | Contoh 1: <menu> <li type="disc"> Daftar item 1 </ li> <li type="circle"> Daftar angka 2 </ li> <li type="square"> Daftar angka 3 </ li> </ MENU> Contoh 2: <ol type="i"> <li> Daftar item 1 </ li> <li> Daftar angka 2 </ li> <li> Daftar angka 3 </ li> <li> Daftar angka 4 </ li> </ Ol> | Contoh 1: (Tips)
Contoh 2:
| ||||||||||||
| HTML link | <link> | <head> <link rel="stylesheet" type="text/css" href="style.css" /> </ Head> | |||||||||||||
| HTML Scrolling Teks | <marquee> (Internet Explorer) | <Marquee bgcolor = " # cccccc "loop =" -1 "scrollamount =" 2 "width =" 100% "> Contoh Marquee </ marquee> | Contoh Marquee (Tips) | ||||||||||||
| HTML Buka Menu | <menu> | <menu> <li type="disc"> Daftar item 1 </ li> <li type="circle"> Daftar angka 2 </ li> <li type="square"> Daftar angka 3 </ li> </ Menu> |
| ||||||||||||
| HTML Meta | <META> | <meta name="description" content="Description dari site"> Anda <meta name="keywords" content="keywords menggambarkan site"> Anda | Tidak ada yang akan menunjukkan (Tips) | ||||||||||||
| HTML Meta | <META> | <meta http-equiv="refresh" CONTENT="4;URL=http://www.yourdomain.com/"> | Tidak ada yang akan menunjukkan (Tips) | ||||||||||||
| HTML Meta | <META> | <meta http-equiv="Pragma" content="no-cache"> | Tidak ada yang akan menunjukkan (Tips) | ||||||||||||
| HTML Meta | <META> | <meta name="rating" content="General"> | Tidak ada yang akan menunjukkan (Tips) | ||||||||||||
| HTML Meta | <META> | <meta name="robots" content="all"> | Tidak ada yang akan menampilkan (Tips) | ||||||||||||
| HTML Meta | <META> | <meta name="robots" content="noindex,follow"> | Tidak ada yang akan menunjukkan (Tips) | ||||||||||||
| HTML Ordered List | <ol> | Bernomor <ol> <li> Daftar item 1 </ li> <li> Daftar angka 2 </ li> <li> Daftar angka 3 </ li> <li> Daftar angka 4 </ li> </ Ol> Bernomor khusus Mulai <ol start="5"> <li> Daftar item 1 </ li> <li> Daftar angka 2 </ li> <li> Daftar angka 3 </ li> <li> Daftar angka 4 </ li> </ Ol> Surat Kecil <ol type="a"> <li> Daftar item 1 </ li> <li> Daftar angka 2 </ li> <li> Daftar angka 3 </ li> <li> Daftar angka 4 </ li> </ Ol> Modal Surat <ol type="A"> <li> Daftar item 1 </ li> <li> Daftar angka 2 </ li> <li> Daftar angka 3 </ li> <li> Daftar angka 4 </ li> </ Ol> Modal Surat Mulai Khusus <ol type="A" start="3"> <li> Daftar item 1 </ li> <li> Daftar angka 2 </ li> <li> Daftar angka 3 </ li> <li> Daftar angka 4 </ li> </ Ol> Huruf kecil Angka Romawi <ol type="i"> <li> Daftar item 1 </ li> <li> Daftar angka 2 </ li> <li> Daftar angka 3 </ li> <li> Daftar angka 4 </ li> </ Ol> Modal Romawi Angka <ol type="I"> <li> Daftar item 1 </ li> <li> Daftar angka 2 </ li> <li> Daftar angka 3 </ li> <li> Daftar angka 4 </ li> </ Ol> Modal Romawi Angka Mulai Khusus <ol type="I" start="7"> <li> Daftar item 1 </ li> <li> Daftar angka 2 </ li> <li> Daftar angka 3 </ li> <li> Daftar angka 4 </ li> </ Ol> | Bernomor
| ||||||||||||
| HTML Listbox Opsi | <option> | <form method=post action="/cgi-bin/example.cgi"> <center> Pilih opsi: <select> <option> opsi 1 </ option> <option dipilih> opsi 2 </ option> <option> pilihan 3 </ option> <option> opsi 4 </ option> <option> pilihan 5 </ option> <option> pilihan 6 </ option> </ Select> <br> </ Center> </ Form> | |||||||||||||
| HTML Ayat | <p> | Ini adalah contoh menampilkan penggunaan dari tag paragraf. <p> ini akan menciptakan satu baris dan spasi di antara baris. Atribut: <p align="left"> Contoh 1: <br /> <br /> Ini adalah contoh <br> menampilkan <br> penggunaan dari tag paragraf </ p>. <p align="right"> Contoh 2: <br> <br> Ini adalah contoh <br> menampilkan <br> penggunaan dari tag paragraf </ p>. <p align="center"> Contoh 3: <br> <br> Ini adalah contoh <br> menampilkan <br> penggunaan dari tag paragraf </ p>. | Ini adalah contoh menampilkan penggunaan dari tag HTML ayat. Ini akan menciptakan satu baris dan spasi di antara baris. Atribut: Contoh 1: Ini adalah contoh menampilkan penggunaan dari tag paragraf. Contoh 2: Ini adalah contoh menampilkan penggunaan dari tag paragraf. Contoh 3: Ini adalah contoh menampilkan penggunaan dari tag paragraf. | ||||||||||||
| HTML kecil (Teks) | <small> | <small> Contoh </ small> | Contoh (Tips) | ||||||||||||
| HTML Teks Dihapus | <strike> | <strike> Contoh </ strike> | | ||||||||||||
| HTML Kuat Penekanan | <strong> | <strong> Contoh </ strong> | Contoh | ||||||||||||
| Tabel HTML | <table> | Contoh 1: <table border= "4" cellpadding="2" cellspacing="2" width="100%"> <tr> <td> Kolom 1 </ td> <td> Kolom 2 </ td> </ Tr> </ Table> Contoh 2: (Internet Explorer) <Perbatasan tabel = "2" bordercolor = " # 336699 "cellpadding =" 2 "cellspacing =" 2 "width =" 100% "> <tr> <td> Kolom 1 </ td> <td> kolom 2 </ td> </ Tr> </ Table> Contoh 3: <table cellpadding= "2" cellspacing="2" width="100%"> <tr> <Td bgcolor = " # cccccc "> Kolom 1 </ td> <Td bgcolor = " # cccccc "> Kolom 2 </ td> </ Tr> <tr> <td> Row 2 </ td> <td> Row 2 </ td> </ Tr> </ Table> | Contoh 1: (Tips)
Contoh 2: (Tips)
Contoh 3: (Tips)
| ||||||||||||
| HTML Tabel Data | <td> | <table border="2" cellpadding="2" cellspacing="2" width="100%"> <tr> <td> Kolom 1 </ td> <td> Kolom 2 </ td> </ Tr> </ Table> |
| ||||||||||||
| HTML Tabel header | <th> | <div align="center"> <table> <tr> <th> Kolom 1 </ th> <th> Kolom 2 </ th> <th> Kolom 3 </ th> </ Tr> <tr> <td> Row 2 </ td> <td> Row 2 </ td> <td> Row 2 </ td> </ Tr> <tr> <td> Row 3 </ td> <td> Row 3 </ td> <td> Row 3 </ td> </ Tr> <tr> <td> Row 4 </ td> <td> Row 4 </ td> <td> Row 4 </ td> </ Tr> </ Table> </ Div> |
| ||||||||||||
| HTML Dokumen Judul | <title> | <title> Judul dari halaman HTML Anda </ title> | Judul dari halaman web Anda akan dapat dilihat dalam judul bar. (Tips) | ||||||||||||
| Baris Tabel HTML | <tr> | <table border="2" cellpadding="2" cellspacing="2" width="100%"> <tr> <td> Kolom 1 </ td> <td> Kolom 2 </ td> </ Tr> </ Table> |
| ||||||||||||
| HTML Teletype | <tt> | <tt> Contoh </ tt> | Contoh | ||||||||||||
| HTML Underline | <u> | <u> Contoh </ u> | Contoh | ||||||||||||
| HTML Unordered List | <ul> | Contoh 1: <br> <br> <ul> <li> Daftar item 1 </ li> <li> Daftar angka 2 </ li> </ Ul> <br> Contoh 2: <br> <ul type="disc"> <li> Daftar item 1 </ li> <li> Daftar angka 2 </ li> <ul type="circle"> <li> Daftar angka 3 </ li> <li> Daftar angka 4 </ li> </ Ul> </ Ul> | Contoh 1:
Contoh 2:
|
0 komentar:
Posting Komentar