Bahasa Penanda HiperTeks, atau HTML, ialah bahasa yang membenarkan penciptaan tapak web yang boleh dilihat oleh sesiapa sahaja yang disambungkan ke Internet. Menurut tinjauan, lebih 55% responden menyatakan mereka menggunakan HTML.
Selain itu, mempelajari HTML biasanya merupakan langkah pertama dalam mana-mana perjalanan pembangun web. Purata pembangun web memperoleh $61,718 setiap tahun, dengan pembangun terkemuka melepasi markah $103,000.
HyperText ialah cara untuk pergi ke dalam talian dengan mengklik pada teks yang dipanggil hiperpautan yang akan membawa satu ke halaman seterusnya.
Pengambilan Utama
Kod asas terdiri daripada pengisytiharan jenis dokumen, teg HTML, teg kepala, teg tajuk dan teg kandungan.
Ia boleh dijalankan pada mana-mana OS, seperti Windows, Mac dan Linux serta mana-mana penyemak imbas, seperti Google Chrome, Mozilla Firefox dan Safari.
Ia juga mempunyai pelbagai aplikasi, seperti membuat blog peribadi, jadual butiran, borang pendaftaran, halaman pendaratan, surat berita dan portfolio dalam talian.
Kelebihannya ialah ia adalah standard terbuka, mudah dipelajari, mesra pemula dengan sokongan komuniti yang sangat baik dan mesra enjin carian.
Kelemahan termasuk keselamatan yang lemah, kekurangan fleksibiliti reka bentuk, output yang tidak konsisten pada pelbagai penyemak imbas dan kefungsian terhad.
Subset HTML
1. XHTML (Bahasa Penanda Hiperteks Boleh Diperluas)
XHTML ialah bahasa penanda berasaskan XML, yang bermaksud ia mematuhi peraturan sintaks dan semantik yang ketat.
XHTML ialah pengganti kepada HTML 4, bertujuan untuk menjadikan bahasa lebih modular dan boleh dikembangkan.
Dokumen XHTML mestilah dibentuk dengan baik dan sah, menjadikannya lebih sukar untuk dibuat dan lebih konsisten serta boleh diakses oleh rangkaian peranti yang lebih luas.
2. SGML (Bahasa Penanda Umum Standard)
SGML ialah bahasa metalanguage yang digunakan untuk mentakrifkan bahasa penanda, termasuk HTML.
SGML menyediakan sintaks standard untuk menerangkan struktur dan kandungan dokumen, menjadikannya berguna untuk bertukar maklumat antara sistem yang berbeza.
SGML ialah sistem yang kompleks dan berkuasa, tetapi sintaks dan kerumitannya menjadikannya kurang digunakan secara meluas berbanding bahasa penanda yang lebih mudah seperti HTML.
3. DHTML (HTML Dinamik)
DHTML merujuk kepada penggunaan HTML, CSS dan JavaScript untuk mencipta halaman web yang dinamik dan interaktif.
DHTML membenarkan untuk memanipulasi kandungan, reka letak dan tingkah laku halaman web sebagai tindak balas kepada tindakan pengguna tanpa memerlukan muat semula halaman.
DHTML digunakan secara meluas untuk mencipta kesan dinamik, seperti menu lungsur turun, petua alat dan tayangan slaid.
Ia juga boleh mencipta animasi dan permainan mudah.
4. TTML2 (Bahasa Penanda Teks Bermasa 2)
TTML2 ialah bahasa penanda yang digunakan untuk mewakili kandungan teks bermasa, seperti kapsyen dan sari kata, dengan cara yang standard.
TTML2 menyediakan set lengkap ciri untuk memformat dan menggayakan teks bermasa, termasuk sokongan untuk berbilang bahasa dan gaya fon.
TTML2 ialah alat penting untuk memastikan kebolehcapaian kandungan multimedia untuk pengguna pekak dan kurang pendengaran serta untuk meningkatkan kebolehgunaan kandungan video untuk semua pengguna.
Templat HTML
Setiap halaman HTML mempunyai templat asas. Ia terdiri daripada bahagian berikut:
Pengisytiharan Jenis Dokumen: Baris pertama dokumen HTML ialah jenis dokumen atau pengisytiharan jenis dokumen, yang mentakrifkan versi HTML yang digunakan.
Sintaks:
<!DOCTYPE html>
Salin selepas log masuk
Salin selepas log masuk
Elemen: Elemen ialah elemen akar bagi dokumen HTML, yang mengandungi semua elemen lain.
Sintaks:
<html>...</html>
Salin selepas log masuk
Elemen Kepala: Elemen kepala mengandungi maklumat tentang dokumen, seperti tajuk, metadata dan pautan ke sumber luaran seperti helaian gaya.
Sintaks:
<head>...</head>
Salin selepas log masuk
Elemen Tajuk: Elemen tajuk mentakrifkan tajuk dokumen, yang ditunjukkan dalam bar tajuk penyemak imbas.
Sintaks:
<title>Name of Web Page</title>
Salin selepas log masuk
Elemen Badan: Elemen badan mengandungi kandungan utama dokumen, termasuk teks, imej dan media lain.
Sintaks:
<body>...</body>
Salin selepas log masuk
Selain daripada teg asas ini, beberapa elemen lain boleh membantu menambah kandungan untuk mencipta tapak web yang hebat. Ini ialah-
Tajuk: Tajuk (H1, H2, H3, dll.) membantu menstruktur kandungan dan menyediakan hierarki maklumat.
<a href="https://www.EDUCBA.com">Link to EDUCBA website</a>
Salin selepas log masuk
Images: Images () can provide visual content in a document.
Syntax:
<img src="image.jpg" alt="Image Description">
Salin selepas log masuk
Code:
<!DOCTYPE html>
EDUCBA’s Page
Hello World! This is EDUCBA’s first web page.
Salin selepas log masuk
Output:
How to Create an HTML Table?
There are specific table tags to create a table – mainly,
,
,
, and
.
Pre-requisites for HTML Table
For an absolute beginner, it is essential to know what the different table tags do before writing a basic code.
: Defines a table
: Defines a table row
: Defines a table header cell
: Defines a table data cell
Student Details Table
John has to create a webpage showing the names of students in a class along with their marks in mathematics and science. He draws the following table.
Name
Mathematics
Science
Mary
78
92
Susan
98
84
Amy
63
79
Now, John wants to write the code to transform this table into an HTML table on a webpage. The steps-
Step #1: Open an HTML code editor. This tutorial demonstrates how to write code in Visual Studio Code. If the PC doesn’t have VS Code, one can download it here.
Step #2: Select File > New Text File.
Step #3: Click on “Select a language” and then type HTML in the text box. Choose the HTML option to create a new HTML file.
Step #4: Again, go to File > Save As and save the file with the filename.html format.
Step #5: Add the basic code, i.e., HTML template of doctype declaration, HTML tag, head tag, title tag, and body tag, as shown below. Set the title as Student Details.
Code:
<!DOCTYPE html>
Student Details
Salin selepas log masuk
Output:
Opening the file should show the following blank web page. Note the title in the browser tab has changed to “Student Details.”
Step #6: Now, define the table using the
tag inside the body tag. Define the first row using the
tag, and add 3 headings cells – Name, Mathematics, and Science, using the
tag. Don’t forget to close the tags with a corresponding closing tag.
To create web pages, provide the structure and content for displaying information in a web browser.
E-commerce
To create online stores, product catalogs, and shopping carts, allowing customers to purchase products and services online.
Landing pages
To develop compelling landing pages for websites that capture a visitor’s attention and encourage them to take a specific action.
Newsletters
It allows the creation of interactive and visually appealing newsletters, such as corporate newsletters, that deliver to subscribers via email.
Online portfolios
To create online portfolios for artists, photographers, and other creatives, showcasing their work and skills to potential clients and employers.
Blogs
One can create blogs, which are personal websites that provide a platform for writing and publishing articles and other content.
Documentation
It helps to create documentation and help files, providing information and guidance to users of the software and other products.
Advertisements
It can help make advertisements embedded on websites and social media platforms, promoting products and services to a wide audience.
Forms
To create a form, one can use
Advantages and Disadvantages
Pros
Cons
Open Standard: It is free of cost and readily available.
Limited Functionality: It cannot perform complex tasks like calculations or data storage.
Easy to Learn: HTML tags are basic and in a readable format, enclosed in angle brackets. It’s easy to learn and use, even for non-programmers.
Poor Security: It is vulnerable to security threats such as cross-site scripting (XSS) and SQL injection.
Search Engine Friendly: Search engines can easily crawl and index the content of the pages.
Inconsistent Browsers: Different browsers render HTML differently, leading to an inconsistent display of web pages on different browsers.
Community Support: It has large community support and many online resources available for learning and troubleshooting.
Poor Design Flexibility: It provides limited design options and creates static websites, making it difficult to create visually appealing dynamic websites without integrating CSS and JavaScript.
Final Thoughts
In conclusion, Hypertext Markup Language is a cornerstone of the World Wide Web. It provides a standardized way of defining the structure and content of a web page using a combination of tags and attributes. With HTML, one can create simple text-based web pages or complex, multimedia-rich applications. It is easy to learn and widely used, making it an essential skill for anyone interested in web development.
FAQs
Q1. How to convert an HTML to PDF?
Answer: To convert, use a library or online service that supports HTML to PDF conversion.
Q2. How to add an image in HTML?
Answer: To add an image, use the tag with the src attribute pointing to the image file’s URL or local path. Example:
<img src="image.jpg" alt="Alt text">
Salin selepas log masuk
Q3. Is HTML a programming language? What is the HTML used for?
Answer: Hypertext Markup Language is not a programming language, it is a markup language used for creating web pages and other information displayed in a web browser. HTML defines the structure and content of a web page using a set of markup tags.
Q4. How to add a video in HTML?
Answer: To add a video, use the
<video src="video.mp4"></video>
Salin selepas log masuk
One can also add controls to play, pause, and adjust volume with the controls attribute:
<video src="video.mp4" controls></video>
Salin selepas log masuk
Q5. Is HTML case-sensitive?
Answer: No, elements are not case-sensitive. However, as best practice, it’s good to follow the same casing in all tags or elements to improve code readability.
Q6. How many tags are in HTML?
Answer: There are over 140 tags specified in the HTML5 standard, but some of them have become obsolete and are not widely used. Commonly used tags include headings, paragraphs, links, images, lists, tables, forms, and multimedia elements like audio and video.
Q7. What is HTML doctype?
Answer: The first line of a document is the doctype or document type declaration, which defines the version of the HTML used. Example:
<!DOCTYPE html>
Salin selepas log masuk
Salin selepas log masuk
Q8. What is an HTML header?
Answer: The HTML tag defines a header section in a document. This section typically contains information such as the page title, logo, and navigation menu. The header section is usually displayed at the top of the page, and its content is typically shared across multiple pages of a website. The header tag helps to define the structure and hierarchy of a web page and makes it easier to create a consistent look and feel across multiple pages.
Atas ialah kandungan terperinci Apakah HTML?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
