Posts

Showing posts from January, 2018

Penggunaan dan Penulisan Tag abbr, cite, dfn dan small Dalam HTML

Image
Pada artikel kali ini kita akan mempelajari Penggunaan dan Penulisan Tag abbr, cite, dfn dan small Dalam HTML. Keempat tag ini digunakan untuk memformat teks dalam HTML.
Penggunaan dan Penulisan Tag abbr Dalam HTML Tag <abbr> merupakan singkatan dari Abbreviation, yang artinya "singkatan" dalam bahasa Indonesia. Tag ini digunakan untuk teks yang berupa singkatan seperti "HTML", "CSS" dan lain-lainnya. Tag ini memiliki sebuah atribut yaitu title yang digunakan untuk menampilkan singkatan berupa tooltip pada saat cursor mouse kita arahkan ke sebuah teks yang menggunakan tag <abbr>.

Tag <abbr> termasuk ke dalam tipe inline element, yang akan ditampilkan oleh web browser pada baris yang sama dengan tag lain yang berada disekitarnya.

Berikut ini contoh penulisan tag <abbr> dalam HTML :
<!DOCTYPE html> <html> <head>     <title>Belajar HTML</title> </head> <body>     <h2>Saya Sedang Belajar H…

Penggunaan dan Penulisan Tag samp, kbd dan var Dalam HTML

Image
Pada artikel kali ini kita akan mempelajari Penggunaan dan Penulisan Tag samp, kbd dan var Dalam HTML.
Penggunaan dan Penulisan Tag samp Dalam HTML Tag <samp> merupakan singkatan dari sample, yang digunakan untuk menampilkan contoh kode program pada halaman website. Sama seperti tag <code>, teks yang berada didalam tag <samp> juga akan ditampilkan dengan font jenis monospace dan menghilangkan spasi yang lebih dari satu spasi. Tag ini termasuk ke dalam tipe inline element,  yang akan ditampilkan oleh web browser pada baris yang sama dengan tag lain yang berada disekitarnya.

Berikut ini contoh penulisan tag <samp> dalam HTML :
<!DOCTYPE html> <html> <head>     <title>Belajar HTML</title> </head> <body>     <h2>Saya Sedang Belajar HTML di Mas-abdi.blogspot.com</h2>     <p>Tag <samp>&lt;samp&gt;</samp> merupakan singkatan dari <i>sample</i>.</p> </body> </html&…

Cara Merubah Arah Teks Pada HTML Dengan Menggunakan Tag bdo

Image
Pada artikel kali ini Saya akan membahas Cara Merubah Arah Teks Pada HTML Dengan Menggunakan Tag bdo.
Penggunaan dan Penulisan Tag bdo Pada HTML Tag <bdo> merupakan singkatan dari Bidirectional Override, yang digunakan untuk merubah arah teks. Normalnya teks akan ditampilkan oleh web browser dari arah kiri ke kanan seperti penulisan bahasa Indonesia dan Inggris, namun dengan tag ini kita bisa merubah arah teks dari arah kanan ke kiri seperti penulisan bahasa Arab.

Tag <bdo> memiliki sebuah atribut, yaitu atribut dir yang dapat diisi dengan salah satu dari kedua nilai, yaitu ltr dan rtl. Nilai ltr merupakan singkatan dari left to right yang akan menampilkan teks dari arah kiri ke kanan, sedangkan nilai rtl merupakan singkatan dari right to left yang akan menampilkan teks dari arah kanan ke kiri. Tag <bdo> termasuk kedalam tipe inline element, yang akan ditampilkan oleh web browser pada baris yang sama dengan tag lain yang berada disekitarnya.

Berikut ini contoh penuli…

Penggunaan dan Penulisan Tag pre dan Tag code Dalam HTML

Image
Jika kita ingin menampilkan teks yang sesuai dengan apa yang kita tulis, baik itu spasi (yang lebih dari satu spasi), baris baru (line break) dan tab pada HTML, maka kita dapat menggunakan tag <pre>. Jika kita menggunakan selain tag <pre>, misalnya tag <p> maka tag tersebut akan menghapus spasi (yang lebih dari satu satu spasi, maka hanya satu spasi yang ditampilkan), baris baru dan juga tab.

Pada artikel kali ini, selain kita mempelajari tag <pre>, kita juga akan mempelajari tag <code>.
Penggunaan dan Penulisan Tag pre Dalam HTML Tag <pre> merupakan singkatan dari Preformatted Text. Sesuai dengan namanya, tag ini digunakan untuk teks yang tidak diformat. Jika kita memasukkan teks atau tulisan di dalam tag <pre>, maka web browser akan menampilkan teksnya sesuai dengan apa yang kita tulis, baik itu spasi (yang lebih dari satu spasi), baris baru dan juga tab. Tag <pre> termasuk kedalam tipe block element, yang akan ditampilkan oleh web bro…

Cara Membuat Kutipan Dalam HTML Dengan Tag blockquote dan Tag q

Image
Untuk membuat kutipan di HTML, kita dapat menggunakan tag <blockquote> dan <q>. Pada artikel kali ini kita akan mempelajari Cara Membuat Kutipan Dalam HTML Dengan Tag blockquote dan Tag q.
Penggunaan dan Penulisan Tag blockquote Dalam HTML Tag <blockquote> digunakan untuk membuat kutipan yang panjang. Tag ini termasuk kedalam tipe block element, yang akan ditampilkan oleh web browser pada baris yang baru.

Berikut ini contoh penulisan tag <blockquote> dalam HTML :
<!DOCTYPE html> <html> <head>     <title>Belajar HTML</title> </head> <body>     <h2>Pengertian HTML</h2>     HTML merupakan bahasa dasar untuk membuat halaman website. Berikut ini adalah definisi HTML yang dikutip dari Wikipedia :     <blockquote>HTML or HyperText Markup Language is the standard markup language used to create web pages. HTML is written in the form of HTML elements consisting of tags enclosed in angle brackets.</blockquote&g…

Cara Membuat Huruf Tercoret (strikethrough) Pada HTML Dengan Tag s dan tag del

Image
Penggunaan huruf tercoret digunakan untuk mengoreksi kata atau kalimat, huruf tercoret dikenal juga dengan istilah strikethrough. Untuk membuat huruf tercoret pada HTML, kita dapat menggunakan tag <s> dan tag <del>. Pada artikel kali ini kita akan mempelajari Cara Membuat Huruf Tercoret (strikethrough) Pada HTML Dengan Tag s dan tag del.
Penggunaan dan Penulisan Tag s Dalam HTML Tag <s> merupakan singkatan dari strikethrough, yang digunakan untuk membuat huruf tercoret.

Berikut ini contoh penulisan tag <s> dalam HTML :
<!DOCTYPE html> <html> <head>     <title>Belajar HTML</title> </head> <body>     <h1>Hallo Dunia!</h1>     <p>Kali ini Saya sedang belajar <s>CSS</s> HTML di website mas-abdi.blogspot.com</p>     <p>HTML merupakan singkatan dari Hypertext Markup Language</p> </body>  </html> Penggunaan dan Penulisan Tag del Dalam HTML Tag <del> merupakan sin…

Cara Membuat Tulisan Matematis Pada HTML Dengan Tag sup dan Tag sub

Image
Mungkin Anda pernah melihat disebuah website yang membahas tentang kimia, seperti rumus kimia H2O dan website yang membahas tentang matematika, seperti perpangkatan 23, lalu bagaimana cara dia membuat tulisan matematis tersebut pada HTML. Nah, Anda berkunjung ke blog yang tepat, karena pada artikel kali ini kita akan mempelajari Cara Membuat Tulisan Matematis Pada HTML Dengan Tag sup dan Tag sub.
Penggunaan dan Penulisan Tag sup Dalam HTML Tag <sup> merupakan singkatan dari Superscript, yaitu sebutan untuk karakter kecil yang berada diatas sebuah huruf. Biasanya superscript digunakan untuk perpangkatan, seperti 23 (Angka 3 termasuk kedalam superscript). Penulisan 23 dalam HTML, seperti ini 2<sup>3</sup>. Tag <sup> termasuk kedalam tipe inline element, yang akan ditampilkan oleh web browser pada baris yang sama dengan tag yang berada disekitarnya.

Berikut ini contoh penulisan tag <sup> dalam HTML :
<!DOCTYPE html> <html> <head>     <tit…

Cara Membuat Huruf Garis Bawah (underline) Dalam HTML Dengan Tag u dan Tag ins

Image
Penggunaan garis bawah pada huruf digunakan sebagai penekanan kata atau kalimat yang dianggap penting. Untuk membuat huruf dengan garis bawah dalam HTML, kita dapat menggunakan tag <u> dan tag <ins>. Pada artikel kali ini kita akan mempelajari Cara Membuat Huruf Garis Bawah (underline) Dalam HTML Dengan Tag u dan ins.
Penggunaan dan Penulisan Tag u Dalam HTML Tag <u> merupakan singkatan dari Underline, yang digunakan untuk membuat huruf dengan garis bawah.

Berikut ini contoh penulisan tag <u> dalam HTML :
<!DOCTYPE html> <html> <head>     <title>Belajar HTML</title> </head> <body>     <h1>Hallo Dunia!</h1>     <p>Kali ini Saya sedang belajar HTML di website mas-abdi.blogspot.com</p>     <p>HTML merupakan singkatan dari <u>Hypertext Markup Language</u></p> </body> </html>
Penggunaan dan Penulisan Tag ins Dalam HTML Tag <ins> merupakan singkatan singkatan da…

Cara Membuat Huruf Miring Dalam HTML Dengan Tag i dan Tag em

Image
Untuk membuat huruf miring pada HTML, kita dapat menggunakan tag <i> dan <em>. Pada artikel kali ini kita akan membahas Cara Membuat Huruf Miring Dalam HTML Dengan Tag i dan em.
Penggunaan dan Penulisan Tag i Dalam HTML Tag <i> merupakan singkatan dari Italic yang digunakan untuk membuat huruf miring. Tag <i> pernah berstatusdeprecated yang artinya tidak disarankan untuk digunakan lagi, hal ini terjadi karena sebagian orang berpendapat bahwa tag yang bertujuan visual seperti ini sebaiknya untuk tidak dipakai lagi dan dialihkan kepada CSS.

Namun pada HTML5 seperti saat ini, tag <i> tetap dipertahankan untuk membuat huruf miring, namun defenisinya diganti menjadi alternative voice yang artinya untuk menandai bagian kata atau kalimat yang berasal dari bahasa asing.

Berikut ini contoh penulisan tag <i> dalam HTML :
<!DOCTYPE html> <html> <head>     <title>Belajar HTML</title> </head> <body>     <h1>Hallo Du…

Cara Membuat Huruf Tebal Dalam HTML Dengan Tag b dan Tag strong

Image
Untuk membuat sebuah huruf menjadi tebal dalam HTML, kita dapat menggunakan tag <b> dan <strong>. Pada artikel kali ini kita akan membahas Cara Membuat Huruf Tebal Dalam HTML Dengan Tag b dan strong.
Penggunaan dan Penulisan Tag b dan strong Dalam HTML Tag <b> merupakan singkatan dari bold yang digunakan untuk membuat huruf tebal. Namun pada saat era xHTML, tag <b> sudah tidak disarankan lagi digunakan, karena untuk membuat huruf tebal sudah digantikan dengan CSS.
Pada awal perkembangan HTML, untuk mengubah dan mempercantik halaman website ditangani langsung oleh HTML. Namun sekarang untuk mempercantik halaman website sudah ditangani oleh CSS. Sebagai penggantinya xHTML menyediakan tag <strong> yang digunakan untuk penegasan sebuah kata atau kalimat, seperti kalimat instruksi atau kalimat penting, yang akan ditampilkan web browser dengan huruf tebal.

Pada HTML5 seperti saat ini, tag <b> sudah menjadi tag resmi HTML5 yang artinya sudah boleh digunaka…

Perbedaan Tag Bertipe Block Element Dengan Inline Element Dalam HTML

Image
Tag HTML memiliki 2 jenis tipe, yaitu block element dan inline element. Pada artikel kali ini kita akan membahas perbedaan kedua jenis tipe tag HTML ini.
Pengertian Tag HTML Dengan Tipe Block Element Tag HTML dengan tipe block element bertujuan untuk membuat tag HTML memisahkan dirinya dengan tag HTML yang ada disekitarnya, seolah-olah tag bertipe block element berada dalam sebuah kotak yang panjang.

Tag HTML yang termasuk tipe block element yaitu : <p>, <h1> sampai <h6>, <ol>, <ul>, <li>, <table>, <form>, fieldset, legend dan <div>.

Berikut ini contoh penulisan tag bertipe block element dalam HTML :
<!DOCTYPE html> <html> <head>     <title>Belajar HTML</title> </head> <body>     <h1>Tag Heading Level 1</h1>     <p>Tag Paragraf</p>     <ol>         <li>Tag List 1</li>         <li>Tag List 2</li>     </ol> </body> </html>

Penggunaan dan Penulisan Tag Textarea Dalam Form HTML

Image
Pada artikel Cara Membuat Form di HTML Saya sudah membahas penggunaan dan penulisan tag textarea, namun pada artikel kali ini kita akan membahas lebih dalam tentang tag textarea beserta atributnya.
Penggunaan dan Penulisan Tag Textarea Tag textarea hampir sama dengan tag input type text, namun yang membuatnya berbeda adalah textarea dapat menampung teks yang lebih dari satu baris. Biasanya textarea ini digunakan untuk inputan teks yang panjang dan lebih dari satu baris seperti komentar, alamat, keterangan, catatan dan lain-lainnya.

Berikut ini penulisan tag textarea :

<textarea><textarea/>

Kita bisa menambahkan isian awalan pada textarea, dengan menambahkan teks diantara tag pembuka dan penutup, seperti berikut ini :

<textarea>Silahkan masukkan komentar Anda<textarea/>

Ada beberapa atribut yang bisa digunakan pada tag textarea, seperti atribut name, maxlengthcols, rows, disabled dan readonly. Berikut ini Saya akan membahas penggunaan dan penulisan atribut yang Sa…

Penggunaan dan Penulisan Tag Select Dalam Form HTML

Image
Pada artikel Cara Membuat Form di HTML Saya sudah membahas penggunaan dan penulisan tag select, pada artikel kali ini kita kan membahas lebih lanjut tentang tag select beserta atributnya.
Penggunaan dan Penulisan Tag Select Tag select digunakan untuk membuat sebuah daftar pilihan yang nantinya akan dipilih salah satu pilihan dari daftar pilihan yang tersedia oleh pengguna atau pengunjung. Pilihan yang tersedia sudah didefinisikan didalam tag select.

Untuk menggunakan tag select, kita juga membutuhkan tag option yang digunakan sebagai isi atau pilihan dari tag select.

Berikut ini penulisan tag select :

<select>     <option>Pilihan 1</option>     <option>Pilihan 2</option>     <option>Pilihan 3</option> </select>
Anda tidak harus menggunakan tag select didalam tag form, namun untuk menggunakan tag select diluar tag form biasanya dikombinasikan dengan JavaScript untuk memproses hasilnya.

Ada beberapa atribut yang sering digunakan pada tag se…

Penggunaan dan Penulisan Tag Input Type Hidden Dalam Form HTML

Image
Pada artikel kali ini kita akan mempelajari Penggunaan dan Penulisan Tag Input Type Hidden Dalam Form HTML.
Penggunaan dan Penulisan Tag Input Type Hidden Penggunaan tag input dengan atribut type="hidden" ini akan membuat pengguna atau pengunjung tidak bisa melihat sebuah objek form. Walaupun begitu objek form yang satu ini bisa dimanfaatkan oleh kita untuk memasukkan suatu data untuk diproses.

Tag input type hidden ini digunakan untuk mengirimkan suatu data dari halaman ke halaman lain tanpa mengganggu bentuk form yang telah ada dan biasanya akan diproses oleh JavaScript atau PHP.

Berikut ini penulisan atribut type="hidden" pada tag input :

<input type="hidden"/>

Ada beberapa atribut yang sering digunakan secara bersamaan dengan atribut type="hidden", seperti atribut name dan value. Berikut ini Saya akan membahas penggunaan dan penulisan atribut yang Saya sebutkan tadi secara bersamaan, dengan atribut type="hidden" pada tag input …

Penggunaan dan Penulisan Tag Input Type File Dalam Form HTML

Image
Form tidak hanya digunakan untuk menerima inputan berupa teks saja, namun juga digunakan untuk menerima inputan sebuah file dari pengguna atau pengunjung, baik itu file gambar, video, suara dan lain-lainnya. Untuk keperluan ini, HTML menyediakan tag input dengan atribut type="file".
Penggunaan dan Penulisan Tag Input Type File Dalam Form HTML Tag input dengan atribut type="file" digunakan untuk membuat sebuah objek form yang bisa melakukan upload file. Untuk memproses upload sendiri kita perlu melibatkan sebuah web server, contohnya seperti PHP. Pada artikel kali ini Saya tidak akan membuat program PHP untuk memproses upload file, namun yang akan kita bahas adalah atribut HTML yang digunakan untuk tombol upload file.

Berikut ini penulisan tag input dengan atribut type="file" :

<input type="file"/>

Jika Anda menjalankan kode HTML di dibrowser, maka akan ada sebuah tombol dengan sebuah teks keterangan disamping tombol tersebut. Nama tombol da…

Penggunaan dan Penulisan Atribut Type Radio Dalam Form HTML

Image
Sebelumnya Saya sudah membahas penggunaan dan penulisan tag input dengan atribut type="radio" pada artikel Cara Membuat Form di HTML, pada artikel kali ini kita akan membahas penggunaan dan penulisan beberapa atribut yang sering digunakan secara bersamaan dengan atribut type="radio" ini.
Beberapa atribut lebih berfungsi untuk mempercatik tampilan form, sebaiknya jika Anda telah menguasai CSS, silahkan pakai CSS untuk keperluan tersebut Penggunaan dan Penulisan Atribut Type Radio Pada Tag Input Tag input dengan atribut type="radio" digunakan untuk membuat tombol radio atau tombol pilihan yang diisi dengan cara memilih salah satu tombol radio yang ada. Biasanya atribut ini digunakan untuk membuat daftar pilihan yang membatasi pengguna atau pengunjung untuk memilih satu pilihan saja diantara pilihan yang tersedia.

Berikut ini contoh penulisan atribut type="radio" pada tag input :

<input type="radio"/>Isi atau keterangan radio

Berikut…