Labkom99 telah banyak memberikan pemahaman tentang beberapa pengetahuan tentang belajar dasar HTML. Kali ini juga akan membuat ringkasan pembelajaran tentang cara cepat tantang Dasar Pemrograman HTML.
1. Definisi HTML
HTML atau Hypertext Markup Language adalah bahasa yang ditulis untuk browser. Saat ini merupakan bahasa yang paling banyak digunakan di web. HTML juga terus diperbarui, dan versi terbaru telah muncul HTML5. Banyak fitur baru telah muncul di HTML5, dan beberapa elemen lama juga telah ditinggalkan. Baca juga Belajar HTML5 Cepat Dan Mudah Langsung Bisa Praktik. Setelah kita menulis file html, buka di browser. Peramban utama termasuk IE, Firefox, Chrome, Google, dll.
2. Elemen Tag HTML
Elemen HTML terdiri dari tag pembuka dan penutup. Seperti <p><p/>,<h1><h1/>. Meskipun jika kita tidak mengetahui arti dari tag tertentu, tag tersebut harus dalam format ini: ada pasangan pembuka <> dan penutup.
Huruf kecil direkomendasikan untuk nama label umum. Label memiliki atribut, dan atribut digunakan untuk mewakili karakteristik label. Misalnya, kita menggunakan ukuran properti untuk mengukur sebuah apel. Jadi, ukuran dapat digunakan untuk mengkarakterisasi apel. Atribut ditulis dalam tag, dan itu ada di tag awal.
3. Struktur Dasar HTML
Struktur terdiri dari header halaman web dan badan halaman web. Contoh berikut:
<html>
<head>
<title>Judul Halaman</title>
</head>
<body>
Isi Halaman
</body>
</html>Pada contoh di atas, tag pertama memberitahu browser bahwa ini adalah awal dari dokumen html. Tag terakhir dari dokumen Html adalah yang memberitahu browser bahwa ini adalah akhir dari html. Teks di antara tag adalah informasi header,dan teks di antara adalah judul dokumen, yang akan ditampilkan di bilah judul jendela browser.
4. Halaman Standard HTML
Pernyataan Deklarasi
Sebelum <html> tuliskan pernyataan deklarasi dokumen: <!DOCTYPE HTML>, tentunya bisa juga ditulis dengan huruf kecil. Peran dari deklarasi dokumen adalah untuk memberitahu browser bahwa dokumen tersebut mengikuti spesifikasi html.
Title Atau Judul
Dalam keadaan normal, kita akan mengatur judul dokumen html. Efek dari ini adalah untuk membuat pengguna terlihat dan merasa ramah. Tagnya adalah <title></title> dan nama judul ditempatkan di dalam tag.
Pengkodean Halaman
Ada banyak jenis penyandian, tetapi utf-8 dan gb2312 biasanya digunakan. utf-8 adalah kode multi-bahasa, dan gb2312 adalah kode yang disederhanakan. Untuk pertanyaan rinci tentang pengkodean, Anda dapat menelusuri blog.
Pernyataan untuk mengatur encoding halaman web adalah <meta charset= “utf-8” />, yang didefinisikan dalam tag.
Kata Kunci Halaman Konten Atau Keyword
Kami dapat mengatur beberapa kata kunci dalam dokumen dan memperkenalkan konten. Keuntungannya adalah ketika halaman web kami dipublikasikan di Internet, pengguna dapat menemukan beberapa halaman web yang cocok dengan memasukkan kata kunci di kotak pencarian. Dengan cara ini, halaman web kita dapat lebih mudah diakses oleh orang lain.
5. Belajar HTML Elemen Umum
Belajar HTML Baris Baru <br>
Istirahat baris adalah yang paling normal untuk mengedit teks. Ketika teks mengisi satu baris, itu perlu dibungkus. Atau bungkus baris dalam teks sesuai kebutuhan, tidak apa-apa. Contoh berikut:
<body>
<br/>
</body>Belajar HTML Paragraf
Saat menulis artikel, kita dapat menggunakan tag p untuk mendefinisikan sebuah paragraf. Dua paragraf didefinisikan sebagai berikut:
<p>
UTF-8. UTF-8 adalah implementasi unicode yang paling banyak digunakan di Internet.
</p>
<p>
Kode GBK, termasuk kode di GB2312, banyak digunakan
</p>Setelah mendefinisikan paragraf, Anda dapat menggunakan atribut align untuk mengatur paragraf. Nilai dari atribut align meliputi kiri (left-aligned), center (center-aligned), dan kanan (right-aligned).
<p align=“center”>
UTF-8. UTF-8 adalah implementasi unicode yang paling banyak digunakan di Internet.
</p>Baca juga Membuat Paragraf HTML Belajar HTML Dengan Mudah
Judul
Judul memiliki enam ukuran, semakin besar angka setelah h, semakin kecil masing-masing huruf judulnya.
<h1>Judul 1</h1>
<h2>Judul 2</h2>
<h3>Judul 3</h3>
<h4>Judul 4</h4>
<h5>Judul 5</h5>
<h6>Judul 6</h6>Pemformatan Teks
Beberapa elemen yang biasa digunakan untuk mengatur font teks:
<b>Menentukan teks tebal</b><br/>
<i> Mendefinisikan teks miring</i><br/>
<del>Tentukan hapus teks</del><br/>
<sup>Tentukan kata superskrip</sup><br/>
<sub>Tentukan kata subskrip</sub><br/>Membuat Hyperlink
Tag a digunakan untuk mendefinisikan hyperlink yang harus berupa atribut href. Fungsi dari href adalah untuk menunjukkan URL yang hyperlink akan ditautkan.
Selain atribut href, ada juga atribut judul yang menunjukkan informasi cepat dari tautan. Atribut target menunjukkan metode pembukaan tautan. Yaitu, ketika tautan diklik, pilih apakah akan membukanya di halaman lain atau halaman ini.
Nilai atributnya meliputi _blank (halaman kosong baru), _self (halaman saat ini), dan _top (halaman saat ini).
<a href="#" target="_blank">Labkom99</a> Nilai href dapat berupa tautan eksternal atau file internal, seperti file ***.html.
<a href=“http://www.labkom99.com”>Labkom99</a>
<a href=“http://www.labkom99.com/jasa-buat-blog”> Buat Website </a>href juga dapat menautkan ke alamat lain, seperti email, telepon, sms.
<a href=“Wa.me”>Wa</a>
<a href=“tel:nomer”>Telphone</a>
<a href="sms:081xxxxxxx">SMS</a>Anchor
Terkadang ketika kita menelusuri web, kita akan menemukan bahwa beberapa halaman web lebih ramah pengguna dan akan ada tombol untuk mengklik kembali ke atas. Efek ini sebenarnya dapat dicapai dengan tag jangkar. Jangkar adalah klik yang menyebabkan pengguna melompat ke bagian dokumen.
<a href="#namaloksi"> </a>
<a name="nama lokasi"> </a>Seperti contoh kode:
<a href="#map">Lompat</a>
<p id="map">Kode</p>Image <img/>
Image <img />Attributes Attribute Value Illustrate src url The address of the image resource width Pixels (px) image width height Pixels (px) image height alt alt text alt text for images
Contoh sebagai berikut:
<img src="img/labkom99.jpg" width="100" height="100" alt="labkom99" />Alamat
Ketika kita memperkenalkan sebuah file, kita harus menulis alamatnya. Yaitu dimana direktori tersebut berada. Dibagi menjadi beberapa situasi berikut:situation Html File Location Image Location Spelling the same directory D:/html/demo.html D:/html/01.jpg <img src=”01.jpg” /><img src=”./01.jpg” /> next level directory D:/html/demo.html D:/html/img/01.jpg <img src=”images/01.jpg”/> previous directory D:/html/demo.html D:/01.jpg <img src=”…/01.jpg”/> Different directories on the same level D:/html/demo.html D:/img/01.jpg <img src=”…/images/01.jpg”/>
Instruksi terkait:
./ Direktori saat ini
…/ kembali ke direktori sebelumnya
image/ masuk ke direktori tingkat pertama
…/images/ kembali ke direktori sebelumnya, lalu masuk ke direktori gambar
Belajar HTML List
Daftar tidak berurutan
Daftar juga merupakan elemen yang umum digunakan dalam HTML. Daftar tidak berurutan diwakili oleh <ul><li></li></ul>. Bisa menggunakan <ul type=”circle”>, <ul type=”disc”> atau <ul type=”square”>
menjelaskan:
atribut: tipe
Nilai atribut: simbol
Contoh disc adalah sebagai berikut:
<ul type="disc">
<li>Apel</li>
<li>Pisang</li>
<li>Mangga</li>
</ul>Daftar berurutan
Daftar berurutan menggunakan sistem numerik atau alfabet untuk mengatur informasi yang terkandung dalam daftar. Daftar berurutan dapat menyusun item menggunakan angka (default), huruf besar, huruf kecil, angka Romawi huruf besar, dan angka Romawi huruf kecil.
Penjelasan: atribut deskripsi nilai atribut tipe 1, a, A, i, saya digunakan untuk memberi tanda di depan item start Nilai awal untuk pengurutan numerik gambar
<ol type="1" start="2">
<li>Apel</li>
<li>Pisang</li>
<li>Mangga</li>
</ol>
<ol type="a">
<li>Apel</li>
<li>Pisang</li>
<li>Mangga</li>
</ol>
<ol type="A">
<li>Apel</li>
<li>Pisang</li>
<li>Mangga</li>
</ol>
<ol type="i">
<li>Apel</li>
<li>Pisang</li>
<li>Mangga</li>
</ol>
<ol type="Aku">
<li>Apel</li>
<li>Pisang</li>
<li>Mangga</li>
</ol>
Daftar definisi
Daftar definisi digunakan untuk mengatur istilah dan definisinya. Setiap informasi yang berisi beberapa istilah dan penjelasan terkait dapat diatur menggunakan daftar definisi.
<dl>
<dt>Hobi</dt>
<dd>Coding</dd>
<dt>Hobi</dt>
<dd>Jalan Jalan</dd>
<dd>Menyanyi</dd>
</dl>
