• id
    • ar
    • en
    • id
Friday, February 6, 2026
FIKTI
  • Home
  • Profil
    • Tentang FIKTI
    • Visi, Misi Tujuan & Sasaran
    • Pimpinan Fakultas
    • Struktur Organisasi
      • Bagan Struktur Organisasi
    • Akreditasi
    • Fasilitas
  • Dosen
  • Penelitian
    • Penelitian Berdampak
    • Pengabdian Masyarakat
    • Daftar Pakar FIKTI UMSU
    • Jurnal
      • JCoSITTE
      • IJDSV
      • Jurnal Se-UMSU
  • MOU
  • Akademik
    • Perpustakaan Digital
      • Universitas
      • Fakultas
      • Sistem Informasi
    • Biaya Kuliah
    • Kalender Akademik
    • E-Learning
    • Portal Mahasiswa
    • Buku Panduan Akademik Mahasiswa
    • Kuliah Kerja Nyata
    • Tahapan Penulisan Skripsi
  • Download
    • Panduan Penulisan Skripsi
    • Panduan Penyusunan Laporan KP
    • Panduan Penyusunan KKN
    • Formulir Permohonan, Perbaikan, Berita Acara Proposal Seminar dan Sidang
  • Prestasi Mahasiswa
  • Home
  • Profil
    • Tentang FIKTI
    • Visi, Misi Tujuan & Sasaran
    • Pimpinan Fakultas
    • Struktur Organisasi
      • Bagan Struktur Organisasi
    • Akreditasi
    • Fasilitas
  • Dosen
  • Penelitian
    • Penelitian Berdampak
    • Pengabdian Masyarakat
    • Daftar Pakar FIKTI UMSU
    • Jurnal
      • JCoSITTE
      • IJDSV
      • Jurnal Se-UMSU
  • MOU
  • Akademik
    • Perpustakaan Digital
      • Universitas
      • Fakultas
      • Sistem Informasi
    • Biaya Kuliah
    • Kalender Akademik
    • E-Learning
    • Portal Mahasiswa
    • Buku Panduan Akademik Mahasiswa
    • Kuliah Kerja Nyata
    • Tahapan Penulisan Skripsi
  • Download
    • Panduan Penulisan Skripsi
    • Panduan Penyusunan Laporan KP
    • Panduan Penyusunan KKN
    • Formulir Permohonan, Perbaikan, Berita Acara Proposal Seminar dan Sidang
  • Prestasi Mahasiswa
No Result
View All Result
FIKTI
ArabicEnglishIndonesian

Cara Membuat Spasi di HTML Dengan Mudah

Annisa by Annisa
in BERITA UMUM
0
0
SHARES
66.7k
VIEWS
Share on FacebookShare on Twitter

Untuk Anda yang tertarik membuat website , mempelajari HTML merupakan salah satu kewajiban yang harus Anda lakukan. HTML atau hypertext markup language merupakan sebuah bahasa pemrograman standar yang akan digunakan untuk membangun sebuah web.

Terutama untuk Anda yang mengingkan web dengan konten utama berupa tulisan. Tentu banyak hal yang akan Anda pelajari jika akan membangun web dengan menggunakan HTML ini.

Cara Membuat Spasi di HTML

Ada beberapa cara untuk membuat kode spasi pada HTML. Apa saja? Yuk, simak artikel ini.

1. Menggunakan  

Ini merupakan salah satu cara membuat spasi di HTML. Menggunakan kode  .   atau non breaking space merupakan kode spasi HTML yang akan bernilai satu spasi. Artinya setiap kode sama dengan sekali kita klik tombol spasi. Ini adalah contoh penggunaan  

<html>
  <head>
    <title>cara membuat spasi</title>
  </head>
  <body>
    ini&nbsp;adalah&nbsp;contoh&nbsp;menggunakan&nbsp;spasi
  </body>
</html>

Dengan kode di atas maka hasilnya akan seperti ini:

Spasi HTML NBSP

Di atas merupakan contoh penggunaan dari kode &nbsp;. Yang perlu diingat adalah pada HTML berapa kalipun tombol spasi kita klik yang ditampilkan hanya lah satu spasi.

2. Menggunakan &ensp;

Jika menggunakan kode &nbsp; untuk membuat jarak antar kata menjadi dua spasi makan kita harus mengetikan kode sebanyak dua kali. Lalu adakah cara yang lebih ringkas untuk membuat jarak antar kata lebih dari satu spasi?.

Maka jawabanya adalah Anda bisa menggunakan kode &ensp; Kode ini nantinya akan membuat jarak antar kata menjadi sekitar dua spasi. Ini adalah contoh dari penggunaan &ensp;

<html>
  <head>
    <title>Cara membuat spasi</title>
  </head>
  <body>
    <h2>cara&nbsp;membuat&nbsp;spasi</h2>
    <h2>cara&nbsp;&nbsp;membuat&nbsp;&nbsp;spasi</h2>
    <h2>cara&ensp;membuat&ensp;spasi
</h2>
  </body>
</html>

Dengan kode tersebut maka hasil yang akan muncul menjadi seperti di bawah ini:

Penggunaan kode ensp dan nbsp

Baris dua dan tiga seperti terlihat di gambar memiliki jarak antar kata yang sama meskipun menggunakan dua kode HTML yang berbeda. Hal itu yang akan menggambarkan perbedaan penggunaan dari dua kode spasi HTML tersebut.

3. Penggunaan &emsp;

Jika &nbsp; memiliki nilai sama dengan satu spasi dan &ensp; bernilai sama dengan dua spasi, maka ada juga kode spasi pada HTML yang memiliki nilai lebih dari itu. Menggunakan &emsp; maka akan membuat jarak antar kata sama dengan empat spasi.

Penggunaan &emsp; akan sangat meringkas penggunaan kode pada HTML. Untuk membuat jarak yang lebih lebar maka kita cukup mengetikan satu kode saja tanpa haru mengetik secara berulang. Berikut adalah contoh penggunaan dari &emsp;.

<html>
  <head>
    <title>Cara membuat spasi</title>
  </head>
  <body>
    <h2>cara&emsp;membuat&emsp;spasi</h2>
  </body>
</html>

Dengan kode seperti di atas maka hasilnya menjadi seperti di bawah ini:

Seperti pada gambar, penggunaan kode &emsp; akan membuat jarak antar kata menjadi semakin lebar.

Ini adalah contoh perbandingan dari ketiga cara membuat spasi di HTML.

<html>
  <head>
    <title>Cara membuat spasi</title>
  </head>
  <body>
    <h2>cara&nbsp;membuat&nbsp;spasi</h2>
    <h2>cara&ensp;membuat&ensp;spasi</h2>
    <h2>cara&emsp;membuat&emsp;spasi</h2>
</body>
</html>

Hasilnya akan terlihat seperti ini:

Membuat spasi dengan tiga kode HTML

Terlihat jelas perbedaan jarak dari ketiga cara tersebut. Yang harus Anda ingat adalah berbeda dengan penggunaan &nbsp; yang bisa mempengaruhi pemotongan tiap baris, penggunaan &ensp; ataupun &emsp; tidak akan mempengaruhi pemotongan baris.

4. Menggunakan Word Spacing

Selain menggunakan ketiga cara tadi. Membuat spasi di HTML juga bisa diatur menggunakan nilai yang kita tentukan. Hal ini berfungsi jika jarak satu spasi seperti biasa dinilai terlalu pendek. Kode ini mengatur jarak antar kata dalam tiap paragraf berada di nilai yang sama antar katanya.

Cara ini menggunakan juga kode CSS. Kode ini akan sangat berguna jika kita akan membuat paragrap di HTML dengan jarak antar kata yang tetap. Berikut adalah contoh dari penggunaan kode ini:

<html>
  <head>
    <title>contoh spasi</title>
  </head>
  <body>
    <p style="word-spacing: 1em;">contoh pengaturan spasi dengan nilai tertentu </p>
  </body>
</html>

Pada kode yang ditulis di atas terlihat jika jarak antar kata yang akan dibuat senilai 1 em. Hasil dari kode di atas adalah seperti di bawah ini:

Membuat spasi dengan word spacing

Jarak antar kata menjadi lebih lebar. Dengan penggunaan kode ini jarak antar kata bisa kita atur sedemikian rupa sesuai dengan keinginan kita.

Satuan ukuran untuk menentukan jaraknya tidak hanya em. Selain menggunakan em, Anda juga bisa menggunakan px ataupun persen. Kelebihan dan kapan penggunaan yang tepat dari ketiga ukuran tadi bisa Anda temukan lebih lanjut ketika Anda belajar css.

Di bawah ini adalah contoh perbandingan dari penggunaan kode – kode di atas dalam membuat spasi di HTML:

Membuat spasi dengan word spacing

Tampilan di atas dibuat dengan kode seperti ini:

<html>
  <head>
    <title>contoh spasi</title>
  </head>
  <body>
    <h3>contoh&nbsp;pengaturan&nbsp;spasi</h3>
    <h3>contoh&ensp;pengaturan&ensp;spasi</h3>
    <h3>contoh&emsp;pengaturan&emsp;spasi</h3>
    <p style="word-spacing: 1em;"><h3>contoh pengaturan spasi</h3></p>
  </body>
</html>

Itulah cara – cara untuk membuat spasi di HTML. Semua cara di atas bisa digunakan tentunya untuk keperluan masing – masing. Pengaturan spasi dalam konten artikel nantinya akan berpengaruh dengan kenyamanan pada saat membaca.

Pengaturan spasi ini juga akan sangat bergunan dalam banyak hal terutama karena pada HTML beberapa tombol yang biasa kita gunakan seperti spasi, enter, ataupun tab tidak memiliki fungsi seperti yang biasa kita gunakan.

Tags: HTMLSPACESPASIWEBSITE
Previous Post

Apa Saja Yang Harus Dipersiapkan Untuk Kompetisi Animasi Komputer?

Next Post

UMSU Sambut Dosen Program RELO US Embassy

Next Post
UMSU Sambut Dosen Program RELO US Embassy

UMSU Sambut Dosen Program RELO US Embassy

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

FIKTI... Teknologi CerdasTeknologi Modern

Facebook Instagram Youtube
Flag Counter

Alamat

fikti@umsu.ac.id | fiktiumsu@gmail.com

© 2025 FIKTI UMSU – Teknologi Cerdas, Teknologi Modern.

No Result
View All Result
  • Home
  • Profil
    • Tentang FIKTI
    • Visi, Misi Tujuan & Sasaran
    • Pimpinan Fakultas
    • Struktur Organisasi
      • Bagan Struktur Organisasi
    • Akreditasi
    • Fasilitas
  • Dosen
  • Penelitian
    • Penelitian Berdampak
    • Pengabdian Masyarakat
    • Daftar Pakar FIKTI UMSU
    • Jurnal
      • JCoSITTE
      • IJDSV
      • Jurnal Se-UMSU
  • MOU
  • Akademik
    • Perpustakaan Digital
      • Universitas
      • Fakultas
      • Sistem Informasi
    • Biaya Kuliah
    • Kalender Akademik
    • E-Learning
    • Portal Mahasiswa
    • Buku Panduan Akademik Mahasiswa
    • Kuliah Kerja Nyata
    • Tahapan Penulisan Skripsi
  • Download
    • Panduan Penulisan Skripsi
    • Panduan Penyusunan Laporan KP
    • Panduan Penyusunan KKN
    • Formulir Permohonan, Perbaikan, Berita Acara Proposal Seminar dan Sidang
  • Prestasi Mahasiswa

© 2025 FIKTI - Teknologi Keren Teknologi Moderen.