Pada artikel ini, kita akan membahas semua hal dasar pengkodean HTML. Ada berbagai tag yang harus kita pertimbangkan dan sertakan saat mulai kode dalam HTML. Tag ini membantu dalam organisasi dan pemformatan dasar elemen dalam skrip atau halaman web kami.

Prosedur langkah demi langkah ini akan memandu Anda melalui proses penulisan HTML.Pada artikel ini, kita akan membahas semua hal dasar pengkodean HTML. Ada berbagai tag yang harus kita pertimbangkan dan sertakan saat mulai kode dalam HTML.

Tag ini membantu dalam organisasi dan pemformatan dasar elemen dalam skrip atau halaman web kami. Prosedur langkah demi langkah ini akan memandu Anda melalui proses penulisan HTML.


Dokumen HTML Dasar

Di bawah ini disebutkan adalah tag HTML dasar yang membagi seluruh dokumen menjadi berbagai bagian seperti head, body, dll.

Setiap dokumen HTML dimulai dengan tag dokumen HTML. Meskipun ini tidak wajib tetapi itu adalah konvensi yang baik untuk memulai dokumen dengan tag yang disebutkan di bawah ini:

<! DOCTYPE html>

<html> : Setiap kode HTML harus dilampirkan di antara tag HTML dasar. Itu dimulai dengan tag <html> dan diakhiri dengan </html> .

<head> : Tag kepala datang berikutnya yang berisi semua informasi header halaman web atau dokumen seperti judul halaman dan informasi lain-lain. Informasi ini terlampir dalam tag kepala yang terbuka dengan <head> dan diakhiri dengan </head> . Isi tag ini akan dijelaskan di bagian selanjutnya tentu saja.

<title>: Kami dapat menyebutkan judul halaman web menggunakan tag <title> . Ini adalah informasi tajuk dan karenanya disebutkan dalam tag tajuk. Tag dimulai dengan <title> dan diakhiri dengan </title>.

<body>: Langkah selanjutnya adalah yang paling penting dari semua tag yang telah kami pelajari sejauh ini. Tag tubuh berisi isi halaman yang akan terlihat oleh semua pengguna. Ini terbuka dengan <body> dan diakhiri dengan </body> . Setiap konten yang terlampir dalam tag ini akan ditampilkan pada halaman web baik itu tulisan atau gambar atau audio atau video atau bahkan tautan. Kita akan melihat nanti di bagian bagaimana menggunakan berbagai tag kita dapat memasukkan konten yang disebutkan ke halaman web kita.

Contoh :

<html> 
<head> 
	<!-- Informasi tentang halaman -->
	<!-- Ini adalah tag comment-->
	<title>BengkalisDev</title> 
</head> 
<body> 
	<!--Isi dari halaman web-->
</body> 
</html>

Kode ini tidak akan menampilkan apa pun. Itu hanya menunjukkan pola dasar bagaimana menulis kode HTML dan akan menamai judul halaman sebagai BengkalisDev .

<! – – komentar di sini – -> adalah tag komentar dalam HTML dan tidak membaca garis yang ada di dalam tag ini.Kode ini tidak akan menampilkan apa pun.

Itu hanya menunjukkan pola dasar bagaimana menulis kode HTML dan akan menamai judul halaman sebagai BengkalisDev .

<! – – komentar di sini – -> adalah tag komentar dalam HTML dan tidak membaca garis yang ada di dalam tag ini.

Tag ini membantu kami memberikan tajuk ke konten halaman web. Tag ini terutama ditulis di dalam tag body. HTML memberi kami enam tag heading dari <h1> ke <h6> .

Setiap tag menampilkan tajuk dengan gaya dan ukuran font yang berbeda.


Tag Untuk Membuat Judul Heading HTML

Tag ini membantu kami memberikan tajuk ke konten halaman web. Tag ini terutama ditulis di dalam tag body. HTML memberi kami enam tag heading dari <h1> ke <h6> . Setiap tag menampilkan tajuk dengan gaya dan ukuran font yang berbeda.

Kode :

<!DOCTYPE html>
<html>
<head>
	<title>BengkalisDev</title>
</head>
<body>
	<h1>Belajar di BengkalisDev</h1>
	<h2>Belajar di BengkalisDev</h2>
	<h3>Belajar di BengkalisDev</h3>
	<h4>Belajar di BengkalisDev</h4>
	<h5>Belajar di BengkalisDev</h5>
	<h6>Belajar di BengkalisDev</h6>
</body>
</html>

Output :


Tag Untuk Membuat Paragraf HTML

Tag ini membantu kita menulis pernyataan paragraf di halaman web. Mereka mulai dengan tag <p> dan berakhir dengan <p> . Di sini tag <br> digunakan untuk memecah baris dan bertindak sebagai pembuat baris baru atau fungsinya sama seperti tombol enter pada keyboard. <br> adalah tag kosong.

Kode :

<html> 
<head> 
    <title>BengkalisDev</title> 
</head> 
<body> 
    <h1>Selamat Datang di BengkalisDev</h1> 
    <p> 
    Belajar Membuat Web HTML Dasar<br>  
    Belajar Membuat Bagian HTML<br> 
    Belajar Tag dan Fungsi pada HTML<br> 
    </p> 
</body> 
</html>

Output :

paragraf html


Tag Untuk Membuat Garis Horizontal HTML

Tag <hr> digunakan untuk memecah halaman menjadi beberapa bagian, menciptakan margin horisontal dengan bantuan garis horizontal berjalan dari kiri ke sisi kanan halaman. Ini juga merupakan tag kosong dan tidak mengambil pernyataan tambahan apa pun.

Kode :

<html> 
<head> 
    <title>BengkalisDev</title> 
</head> 
<body> 
    <h1>Selamat Datang di BengkalisDev</h1> 
    <p> 
    Belajar Membuat Web HTML Dasar<br>  
    Belajar Membuat Bagian HTML<br> 
    Belajar Tag dan Fungsi pada HTML<br> 
    </p> 
    <hr>
    <p> 
    Belajar Membuat Web HTML Dasar<br>  
    Belajar Membuat Bagian HTML<br> 
    Belajar Tag dan Fungsi pada HTML<br> 
    </p> 
    <hr>
    <p> 
    Belajar Membuat Web HTML Dasar<br>  
    Belajar Membuat Bagian HTML<br> 
    Belajar Tag dan Fungsi pada HTML<br> 
    </p> 
    
</body> 
</html>

Output :

garis horizontal html


Tag Untuk Memasukkan Gambar Pada HTML

Tag gambar digunakan untuk menyisipkan gambar ke halaman web kami. Sumber gambar yang akan dimasukkan dimasukkan ke dalam tag <img src = ” sumber gambar / letak gambar “> . Contoh :

Kode :

<html> 
<head> 
    <title>BengkalisDev</title> 
</head> 
<body> 
    <img src="https://bengkalisdev.com/wp-content/uploads/2020/08/bogeng-1.png">    
</body> 
</html>

Output :

cara menambah gambar pada html

Sekian dulu untuk artikel kali ini, Ada juga berbagai tag lain dalam HTML untuk menyisipkan tautan, audio, dan berbagai tag format lain yang akan kita pelajari di bagian selanjutnya.


Choose A Format
Personality quiz
Series of questions that intends to reveal something about the personality
Trivia quiz
Series of questions with right and wrong answers that intends to check knowledge
Poll
Voting to make decisions or determine opinions
Story
Formatted Text with Embeds and Visuals
List
The Classic Internet Listicles
Countdown
The Classic Internet Countdowns
Open List
Submit your own item and vote up for the best submission
Ranked List
Upvote or downvote to decide the best list item
Meme
Upload your own images to make custom memes
Video
Youtube, Vimeo or Vine Embeds
Audio
Soundcloud or Mixcloud Embeds
Image
Photo or GIF
Gif
GIF format

Send this to a friend