Definisi Tag HTML

Apa yang Anda Perlu Tahu Tentang Tag HTML

HTML adalah bahasa Web. Halaman web yang anda lihat pada komputer atau telefon anda, termasuk yang satu ini, ditulis dalam Bahasa Hypertext Markup menggunakan apa yang dikenali sebagai "tag HTML". Anda boleh memikirkan HTML sebagai "kod bawah bawah" yang mengawal struktur halaman web.

Pada akhirnya, apabila anda mempelajari bahasa baru, anda mula dengan frasa mudah dan membina dari sana. Belajar tentang HTML tidak berbeza. Anda akan bermula dengan menguasai tag HTML biasa. Ini bersamaan dengan pembelajaran "frasa mudah" dalam bahasa yang digunakan. Frasa-frasa tersebut menjadi landasan dasar di mana anda membina pengetahuan dan ucapan anda, sama seperti tag HTML adalah asas yang anda akan membina kemahiran pembangunan web anda.

Format Tag HTML

Anda boleh mengenali teg HTML kerana ia dikelilingi oleh aksara pada permulaan dan akhir tag. Antara kedua-dua watak ini akan menjadi teks lain yang mentakrifkan jenis tag HTML yang sedang ditulis. Contohnya, jika anda tahu bahawa "hr" bermakna peraturan mendatar (atau baris) anda akan menulis ini untuk tag HTML:


Anda baru sahaja menulis tag HTML yang menarik peraturan mendatar pada halaman web.

Kebanyakan tag HTML muncul secara berpasangan. Mereka diletakkan pada permulaan dan pada akhir bahagian teks untuk menentukan kandungan yang akan mereka isi. Pasangan tag ini membentuk elemen HTML . Apabila anda mengetahui bahawa dan adalah tag pembuka dan tutup untuk membuat teks berani, anda mula memahami bagaimana tag HTML menjejaskan penampilan teks pada halaman web.

Kalimat ini akan muncul dalam semua berani kerana tagnya.

Perhatikan bahawa teg teg penutupan (yang bermaksud "penekanan kuat dan yang, secara lalai, menjadikan teks sebagai berani) adalah sama dengan tag pembukaan yang berani kecuali ia termasuk garis miring dalam teg. Ini adalah format yang diikuti oleh kebanyakan Tag HTML. Tag pembuka dan tag penutup adalah sama, dengan penambahan slash pada penutupan yang mengikuti

Gabungan Tag HTML

Tag HTML sering digunakan dalam gabungan. Tag pembuka dan tutup untuk teks yang ditekankan (italik) adalah dan . Menambah tag italik kepada satu perkataan dalam contoh kalimat berani semua menyebabkan perkataan muncul adalah huruf tebal dan miring di laman web.

Kalimat ini akan muncul dalam semua berani kerana tagnya.

Apabila beberapa tag digunakan bersama dalam elemen halaman web, dengan beberapa tag yang muncul di dalam orang lain, mereka dirujuk sebagai tag HTML bersarang. Anda harus ingat bahawa teg bersarang, yang merupakan tag di dalam yang lain, mesti ditutup sebelum tag mereka mengandungi ditutup. Lihat contoh ini:

Ini adalah teks yang ditekankan untuk sebab tertentu.

Anda perlu melihat bahawa tanda dibuka dalam

, yang bermaksud ia mesti ditutup sebelum tanda penutup muncul. Fikirkan tag bersarang seperti kotak di dalam kotak lain. Kotak dalaman mesti ditutup sebelum luarannya, mengandungi kotak.

Tags HTML dan Laman Web

Terdapat puluhan tag HTML dalam HTML yang sah. Sesetengah tag HTML menentukan sangat umum, elemen asas seperti perenggan, sementara yang lain lebih rumit dan menambah lebih banyak fungsi, seperti pautan atau "jangkar" tag. Senarai tag HTML memberikan gambaran tentang banyak fungsi tag yang boleh dilakukan di laman web menggunakan tag.

Terdapat juga beberapa tag yang diperlukan untuk semua halaman web. Semasa anda membina halaman pertama anda, anda akan menggunakan tag , yang memulakan halaman web; yang memberitahu penyemak imbas apa yang hendak dipaparkan di bahagian atas anak tetingkap pelayar, dan <body>, di mana semua maklumat laman web berjalan dan merupakan bahagian terbesar halaman anda. </p> <p> Senarai tag HTML tidak banyak membantu sehingga anda telah melewati tutorial HTML, tetapi selepas anda melakukannya, anda boleh menggunakan tag HTML untuk membina laman web anda sendiri. Satu nota, jangan diliputi oleh bilangan tag HTML yang mungkin. Walaupun terdapat beratus-ratus tag yang boleh digunakan, realiti adalah bahawa anda mungkin hanya menggunakan segelintir mereka berulang kali. Malah, ada beberapa tag HTML yang saya tidak pernah gunakan sekali dalam dekad laman web kerja reka bentuk saya! </p> <h3> Tag yang dihentikan </h3><p> <a href="https://ms.eyewated.com/rujukan-html-5-huruf-html-5-mengikut-huruf/">HTML5</a> adalah standard markup semasa. Beberapa tag yang digunakan dalam versi sebelumnya HTML kini dikendalikan oleh helaian gaya dalam HTML5. Tag HTML yang telah ditanggalkan telah dikeluarkan daripada spesifikasi HTML. Lebih baik tidak menggunakan sebarang tag usang. </p> <p> Artikel asal oleh Jennifer Krynin. Disunting oleh Jeremy Girard pada 5/2/17 </p> </div> <div class="amp-related-wrapper"> <h2>Alike posts</h2> <div class="amp-related-content"> <a href="https://ms.eyewated.com/bagaimana-mengedit-html-dengan-textedit/"> <amp-img src="https://exse.eyewated.com/pict/62a09da409813588-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/bagaimana-mengedit-html-dengan-textedit/">Bagaimana Mengedit HTML Dengan TextEdit</a></h3> <div class="amp-related-meta"> Reka Bentuk Web & Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/bagaimana-menggunakan-kod-html-untuk-karakter-bahasa-jerman/"> <amp-img src="https://exse.eyewated.com/pict/141f4379729d345c-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/bagaimana-menggunakan-kod-html-untuk-karakter-bahasa-jerman/">Bagaimana Menggunakan Kod HTML untuk Karakter Bahasa Jerman</a></h3> <div class="amp-related-meta"> Reka Bentuk Web & Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/senarai-komprehensif-kod-html-untuk-watak-bahasa-turki/"> <amp-img src="https://exse.eyewated.com/pict/c2d45c92534f347a-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/senarai-komprehensif-kod-html-untuk-watak-bahasa-turki/">Senarai Komprehensif Kod HTML untuk Watak Bahasa Turki</a></h3> <div class="amp-related-meta"> Reka Bentuk Web & Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/menggunakan-html-table-atribut-elemen/"> <amp-img src="https://exse.eyewated.com/pict/bc751870b8843c81-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/menggunakan-html-table-atribut-elemen/">Menggunakan HTML TABLE Atribut Elemen</a></h3> <div class="amp-related-meta"> Reka Bentuk Web & Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/menulis-html-dalam-notepad/"> <amp-img src="https://exse.eyewated.com/pict/2fb0aeb59c9a33d5-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/menulis-html-dalam-notepad/">Menulis HTML dalam Notepad</a></h3> <div class="amp-related-meta"> Reka Bentuk Web & Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/cara-menukar-dokumen-word-ke-html/"> <amp-img src="https://exse.eyewated.com/pict/aea5b69ee3ce2fdb-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/cara-menukar-dokumen-word-ke-html/">Cara Menukar Dokumen Word ke HTML</a></h3> <div class="amp-related-meta"> Reka Bentuk Web & Dev </div> </div> </div> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/tag-penutup-tidak-diperlukan/">Tag Penutup Tidak Diperlukan</a></h3> <div class="amp-related-meta"> Reka Bentuk Web & Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/pengenalan-teks-editor-bluefish/"> <amp-img src="https://exse.eyewated.com/pict/1c9b46d24949324c-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/pengenalan-teks-editor-bluefish/">Pengenalan Teks Editor Bluefish</a></h3> <div class="amp-related-meta"> Reka Bentuk Web & Dev </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/banish-space-funky-dalam-jadual-html-anda/"> <amp-img src="https://exse.eyewated.com/pict/88096f5a98fe3ef4-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/banish-space-funky-dalam-jadual-html-anda/">Banish Space Funky dalam Jadual HTML Anda</a></h3> <div class="amp-related-meta"> Reka Bentuk Web & Dev </div> </div> </div> </div> <div class="amp-related-wrapper"> <h2>See Newest</h2> <div class="amp-related-content"> <a href="https://ms.eyewated.com/cara-cari-alamat-e-mel-dalam-talian/"> <amp-img src="https://exse.eyewated.com/pict/67d5c96593563560-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/cara-cari-alamat-e-mel-dalam-talian/">Cara Cari Alamat E-mel Dalam Talian</a></h3> <div class="amp-related-meta"> Carian sesawang </div> </div> </div> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/bagaimana-mengubah-bunyi-mel-baru-di-mac-os-x-mail/">Bagaimana Mengubah Bunyi Mel Baru di Mac OS X Mail</a></h3> <div class="amp-related-meta"> Mac </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/templat-autumn-terbaik-untuk-membuat-flyers-dan-lagi-untuk-acara-kejatuhan/"> <amp-img src="https://exse.eyewated.com/pict/04efa0d0b8d8366c-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/templat-autumn-terbaik-untuk-membuat-flyers-dan-lagi-untuk-acara-kejatuhan/">Templat Autumn Terbaik untuk Membuat Flyers dan Lagi untuk Acara Kejatuhan</a></h3> <div class="amp-related-meta"> Perisian </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/pokemon-go-dan-mengapa-realiti-campuran-masih-tidak-menentu/"> <amp-img src="https://exse.eyewated.com/pict/6e6ad2f2686733fb-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/pokemon-go-dan-mengapa-realiti-campuran-masih-tidak-menentu/">Pokemon GO, dan Mengapa Realiti Campuran Masih Tidak Menentu</a></h3> <div class="amp-related-meta"> Permainan </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/monitor-lcd-17-inci-yang-terbaik/"> <amp-img src="https://exse.eyewated.com/pict/18bb8ddcc4f43248-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/monitor-lcd-17-inci-yang-terbaik/">Monitor LCD 17-inci yang terbaik</a></h3> <div class="amp-related-meta"> Membeli Panduan </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/bagaimana-untuk-watermark-foto-di-photoshop-elements/"> <amp-img src="https://exse.eyewated.com/pict/4ef915ec2dd92f84-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/bagaimana-untuk-watermark-foto-di-photoshop-elements/">Bagaimana untuk Watermark Foto di Photoshop Elements</a></h3> <div class="amp-related-meta"> Perisian </div> </div> </div> </div> <div class="amp-related-wrapper"> <h2>Sapid posts</h2> <div class="amp-related-content"> <a href="https://ms.eyewated.com/cara-membuat-kad-ucapan/"> <amp-img src="https://exse.eyewated.com/pict/63b5e1af3d9b3384-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/cara-membuat-kad-ucapan/">Cara Membuat Kad Ucapan</a></h3> <div class="amp-related-meta"> Perisian </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/cara-menangkap-skrin-ipad/"> <amp-img src="https://exse.eyewated.com/pict/87f7c3397ccf345e-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/cara-menangkap-skrin-ipad/">Cara Menangkap Skrin iPad</a></h3> <div class="amp-related-meta"> IPad </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/call-of-duty-black-ops-cheats-xbox-360/"> <amp-img src="https://exse.eyewated.com/pict/2e87e83639db37a2-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/call-of-duty-black-ops-cheats-xbox-360/">Call of Duty: Black Ops Cheats - Xbox 360</a></h3> <div class="amp-related-meta"> Permainan </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/onkyo-thx-certified-tx-nr737-tx-nr838-receivers/"> <amp-img src="https://exse.eyewated.com/pict/83e13a3985543765-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/onkyo-thx-certified-tx-nr737-tx-nr838-receivers/">Onkyo THX-Certified TX-NR737 / TX-NR838 Receivers</a></h3> <div class="amp-related-meta"> Ulasan Produk </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/cara-nonaktifkan-restart-automatik-di-windows-vista/"> <amp-img src="https://exse.eyewated.com/pict/0476b475af9c42e2-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/cara-nonaktifkan-restart-automatik-di-windows-vista/">Cara Nonaktifkan Restart Automatik di Windows Vista</a></h3> <div class="amp-related-meta"> Windows </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/cara-memesan-tiket-plane-dengan-google/"> <amp-img src="https://exse.eyewated.com/pict/73a58784795c3506-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/cara-memesan-tiket-plane-dengan-google/">Cara Memesan Tiket Plane dengan Google</a></h3> <div class="amp-related-meta"> Carian sesawang </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/top-5-recipe-apps-untuk-vegetarians-and-vegans/"> <amp-img src="https://exse.eyewated.com/pict/5f6b55eb6603346e-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/top-5-recipe-apps-untuk-vegetarians-and-vegans/">Top 5 Recipe Apps untuk Vegetarians and Vegans</a></h3> <div class="amp-related-meta"> Perisian & Aplikasi </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/kajian-carbonite/"> <amp-img src="https://exse.eyewated.com/pict/c87a72f0ef8d32d5-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/kajian-carbonite/">Kajian Carbonite</a></h3> <div class="amp-related-meta"> Perisian & Aplikasi </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/kelebihan-dan-kekurangan-rangkaian-sosial/"> <amp-img src="https://exse.eyewated.com/pict/5ed6dc1bc0672f6b-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/kelebihan-dan-kekurangan-rangkaian-sosial/">Kelebihan dan Kekurangan Rangkaian Sosial</a></h3> <div class="amp-related-meta"> Media Sosial </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/panduan-rujukan-model-osi/"> <amp-img src="https://exse.eyewated.com/pict/f4ed7b24ca4d3494-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/panduan-rujukan-model-osi/">Panduan Rujukan Model OSI</a></h3> <div class="amp-related-meta"> Internet & Rangkaian </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/cara-sambungkan-headphone-anda-ke-mana-mana-tv-melalui-bluetooth-tanpa-wayar/"> <amp-img src="https://exse.eyewated.com/pict/1a7377967f583549-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/cara-sambungkan-headphone-anda-ke-mana-mana-tv-melalui-bluetooth-tanpa-wayar/">Cara Sambungkan Headphone Anda ke Mana-mana TV melalui Bluetooth Tanpa Wayar</a></h3> <div class="amp-related-meta"> Teater rumah </div> </div> </div> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/the-10-best-kids-xbox-360-dan-kinect-games-to-buy-in-2018/">The 10 Best Kids 'Xbox 360 dan Kinect Games to Buy in 2018</a></h3> <div class="amp-related-meta"> Permainan </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/pelan-data-3g-4g-ipad-at-t-murah-verizon-lebih-baik/"> <amp-img src="https://exse.eyewated.com/pict/1bd5938666a93448-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/pelan-data-3g-4g-ipad-at-t-murah-verizon-lebih-baik/">Pelan Data 3G / 4G iPad: AT & T Murah, Verizon Lebih Baik</a></h3> <div class="amp-related-meta"> Membeli Panduan </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/cara-cadangkan-ciri-untuk-outlook-mail-outlook-com/"> <amp-img src="https://exse.eyewated.com/pict/6ed3b6eb3c924c89-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/cara-cadangkan-ciri-untuk-outlook-mail-outlook-com/">Cara Cadangkan Ciri untuk Outlook Mail (Outlook.com)</a></h3> <div class="amp-related-meta"> E-mel & Pesanan </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/belajar-command-linux-lsmod/"> <amp-img src="https://exse.eyewated.com/pict/7e95cb39431e3413-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/belajar-command-linux-lsmod/">Belajar Command Linux - lsmod</a></h3> <div class="amp-related-meta"> Linux </div> </div> </div> <div class="amp-related-content"> <a href="https://ms.eyewated.com/pemandu-3-cheats-ps2/"> <amp-img src="https://exse.eyewated.com/pict/6480f81f4501322e-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://ms.eyewated.com/pemandu-3-cheats-ps2/">Pemandu 3 Cheats - PS2</a></h3> <div class="amp-related-meta"> Permainan </div> </div> </div> </div></article> <footer class="amp-wp-footer"> <div class="amp-wp-footer-inner"> <a href="#" class="back-to-top">Back to top</a> <p class="copyright"> © 2024 ms.eyewated.com </p> <div class="amp-wp-social-footer"> <a href="#" class="jeg_facebook"><i class="fa fa-facebook"></i> </a><a href="#" class="jeg_twitter"><i class="fa fa-twitter"></i> </a><a href="#" class="jeg_google-plus"><i class="fa fa-google-plus"></i> </a><a href="#" class="jeg_pinterest"><i class="fa fa-pinterest"></i> </a><a href="" class="jeg_rss"><i class="fa fa-rss"></i> </a> </div> </div> </footer> <div id="statcounter"> <amp-pixel src="https://c.statcounter.com/12022999/0/02d06b5d/1/"> </amp-pixel> </div> </body> </html> <!-- Dynamic page generated in 1.288 seconds. --> <!-- Cached page generated by WP-Super-Cache on 2019-10-03 23:29:55 --> <!-- 0.002 -->