Script Html Bucin Cara Membuat Halaman Web Yang Romantis - mediabagus.com

2 min read 02-10-2024

Script Html Bucin Cara Membuat Halaman Web Yang Romantis

Pendahuluan

Siapa bilang mengekspresikan rasa cinta harus selalu melalui bunga atau cokelat? Di era digital ini, kamu bisa membuat website romantis untuk orang tersayang. Website ini bisa berisi puisi, foto-foto kenangan, hingga video romantis.

Bayangkan, saat orang tersayang membuka website buatanmu, mereka akan disambut dengan pesan cinta dan visual yang menarik. Ini akan menjadi momen spesial yang akan mereka ingat selamanya.

Artikel ini akan membahas cara membuat website romantis dengan HTML dasar.

Memulai Perjalanan Website Romantis

Pertama-tama, kamu perlu membuka editor teks seperti Notepad atau Sublime Text.

<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Website Romantis untuk [Nama Pasangan]</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>

</body>
</html>

Kode ini merupakan kerangka dasar website HTML.

: Menentukan dokumen sebagai HTML.
: Menentukan bahasa website, dalam hal ini bahasa Indonesia.
: Berisi informasi tentang website, seperti judul dan style.
</strong>: Judul website yang akan ditampilkan pada tab browser.</li> <li><strong><link rel="stylesheet" href="style.css"></strong>: Menghubungkan ke file CSS untuk mengatur tampilan website.</li> <li><strong><body></strong>: Berisi konten website yang akan dilihat pengguna.</li> </ul> <h2>Menambahkan Sentuhan Cinta di Setiap Sudut</h2> <p>Sekarang, mari kita tambahkan elemen-elemen dasar untuk website romantis.</p> <pre><code class="hljs"><!DOCTYPE html> <html lang="id"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Website Romantis untuk [Nama Pasangan]</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>Sayang, ini untukmu!</h1> <p>Website ini dibuat khusus untuk kamu, [Nama Pasangan], sebagai bukti betapa aku mencintaimu.</p> <img src="https://tse1.mm.bing.net/th?q=gambar%20romantis" alt="Gambar Romantis"> <p>Aku harap kamu menyukainya.</p> </body> </html> </code></pre> <ul> <li><strong><h1></strong>: Tag heading tingkat 1 untuk judul besar.</li> <li><strong><p></strong>: Tag paragraf untuk menuliskan teks.</li> <li><strong><img src="https://tse1.mm.bing.net/th?q=gambar%20romantis" alt="Gambar Romantis"></strong>: Tag gambar untuk menampilkan gambar. Ganti "<a href="https://tse1.mm.bing.net/th?q=gambar%20romantis">https://tse1.mm.bing.net/th?q=gambar romantis</a>" dengan URL gambar yang ingin kamu tampilkan.</li> </ul> <h2>Menambahkan Elemen-Elemen Romantis</h2> <p>Website romantis bisa dihiasi dengan berbagai elemen menarik. Berikut beberapa ide:</p> <ul> <li><strong>Foto kenangan</strong>: Tambahkan galeri foto kalian berdua, mulai dari awal kenalan hingga momen-momen penting dalam hubungan.</li> <li><strong>Video romantis</strong>: Ungkapkan rasa sayang melalui video, bisa berupa ucapan cinta atau montage video kenangan.</li> <li><strong>Puisi atau quotes</strong>: Tuliskan puisi atau kutipan romantis yang menyentuh hati pasanganmu.</li> <li><strong>Lagu romantis</strong>: Sematkan lagu romantis yang memiliki makna spesial bagi kalian berdua.</li> </ul> <h2>Menyempurnakan Tampilan Website</h2> <p><strong>File style.css</strong>:</p> <pre><code class="hljs">body { font-family: 'Arial', sans-serif; background-color: #f0f0f0; color: #333; text-align: center; } h1 { font-size: 3em; color: #e74c3c; margin-bottom: 1em; } p { font-size: 1.2em; line-height: 1.6; margin-bottom: 1em; } img { max-width: 100%; height: auto; border-radius: 10px; margin-bottom: 2em; } </code></pre> <p>Kode ini merupakan contoh CSS untuk mengatur tampilan website.</p> <ul> <li><strong>body</strong>: Menentukan pengaturan dasar untuk seluruh website, seperti font, warna latar belakang, dan warna teks.</li> <li><strong>h1</strong>: Menentukan pengaturan untuk judul besar.</li> <li><strong>p</strong>: Menentukan pengaturan untuk paragraf.</li> <li><strong>img</strong>: Menentukan pengaturan untuk gambar, seperti lebar maksimal dan bentuk.</li> </ul> <h2>Menyimpan dan Mengakses Website</h2> <p>Setelah semua kode HTML dan CSS selesai, simpan file HTML dengan ekstensi .html dan file CSS dengan ekstensi .css.</p> <p>Kamu dapat membuka website dengan mengklik dua kali file HTML.</p> <h2>Kesimpulan</h2> <p>Membuat website romantis dengan HTML adalah cara unik untuk menunjukkan kasih sayang. Kamu bisa menyesuaikan website dengan gaya dan elemen favorit pasanganmu. Website ini bukan hanya sekadar website, tetapi juga sebuah bukti cinta yang akan dikenang selamanya.</p> </div> </div> </div> </div> </div> </section> </div> </div> </article> <div class="ab ca"> <div class="ch bg fy fz ga gb"></div> </div> </div> <div class="ab ca"> <div class="ch bg fy fz ga gb"> <div class="ps iz"> <div class="pt" itemprop="keywords"> <a class="pu ax am ao" rel="noopener follow" id="tag_news" href="http://mediabagus.com/category/news"> <span class="pv fi cw pw gd px py be b bf z bj pz">news</span> </a> </div> </div> </div> </div> <div class="l"></div> <div class="ab ca" itemscope itemtype="https://schema.org/BreadcrumbList"> <div class="ch bg fy fz ga gb"> <h2 class="gr gs gt be gu gv gw gx gy gz ha hb hc hd he hf hg hh hi hj hk hl hm hn ho hp hq hr hs ht bj" itemprop="name">Related Posts</h2> <hr> <ul> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="1"> <a itemprop="item url" href="http://mediabagus.com/post/mengenal-apa-itu-aplikasi-mod-serta-bahayanya" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">Mengenal Apa Itu Aplikasi Mod Serta Bahayanya </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">27-09-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 368</span> </div> </li> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="2"> <a itemprop="item url" href="http://mediabagus.com/post/react-native-vs-native-development-a-guide-to-informed" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">React Native Vs Native Development A Guide To Informed Decision Making </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">27-09-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 344</span> </div> </li> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="3"> <a itemprop="item url" href="http://mediabagus.com/post/the-benefit-of-software-development-service-for-your" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">The Benefit Of Software Development Service For Your Business Growth </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">25-09-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 327</span> </div> </li> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="4"> <a itemprop="item url" href="http://mediabagus.com/post/apakah-seo-specialist-harus-bisa-coding-ini-jawabannya" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">Apakah Seo Specialist Harus Bisa Coding Ini Jawabannya </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">25-09-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 321</span> </div> </li> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="5"> <a itemprop="item url" href="http://mediabagus.com/post/debugging-tool-definition-detailed-explanation-software" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">Debugging Tool Definition Detailed Explanation Software Glossary Terms </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">24-09-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 268</span> </div> </li> </ul> </div> </div> <div class="ab ca" itemscope itemtype="https://schema.org/BreadcrumbList"> <div class="ch bg fy fz ga gb"> <h2 class="gr gs gt be gu gv gw gx gy gz ha hb hc hd he hf hg hh hi hj hk hl hm hn ho hp hq hr hs ht bj" itemprop="name">Latest Posts</h2> <hr> <ul> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="1"> <a itemprop="item url" href="http://mediabagus.com/post/15-hp-1-jutaan-ram-besar-terbaik-di-2023" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">15 Hp 1 Jutaan Ram Besar Terbaik Di 2023 </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">09-10-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 0</span> </div> </li> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="2"> <a itemprop="item url" href="http://mediabagus.com/post/3-cara-bayar-first-media-lewat-m-banking-bca-dan-syaratnya" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">3 Cara Bayar First Media Lewat M Banking Bca Dan Syaratnya </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">09-10-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 0</span> </div> </li> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="3"> <a itemprop="item url" href="http://mediabagus.com/post/reasons-you-need-regular-maintenance-of-your-water-purifier" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">Reasons You Need Regular Maintenance Of Your Water Purifier </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">09-10-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 0</span> </div> </li> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="4"> <a itemprop="item url" href="http://mediabagus.com/post/what-to-do-in-a-hit-and-run-accident" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">What To Do In A Hit And Run Accident </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">09-10-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 0</span> </div> </li> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="5"> <a itemprop="item url" href="http://mediabagus.com/post/spesifikasi-xiaomi-redmi-9-c-pilihan-terbaik-dengan-fitur" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">Spesifikasi Xiaomi Redmi 9C Pilihan Terbaik Dengan Fitur Unggulan </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">09-10-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 0</span> </div> </li> </ul> </div> </div> <div class="ab ca" itemscope itemtype="https://schema.org/BreadcrumbList"> <div class="ch bg fy fz ga gb"> <h2 class="gr gs gt be gu gv gw gx gy gz ha hb hc hd he hf hg hh hi hj hk hl hm hn ho hp hq hr hs ht bj" itemprop="name">Popular Posts</h2> <hr> <ul> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="1"> <a itemprop="item url" href="http://mediabagus.com/post/mengenal-apa-itu-aplikasi-mod-serta-bahayanya" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">Mengenal Apa Itu Aplikasi Mod Serta Bahayanya </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">27-09-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 368</span> </div> </li> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="2"> <a itemprop="item url" href="http://mediabagus.com/post/react-native-vs-native-development-a-guide-to-informed" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">React Native Vs Native Development A Guide To Informed Decision Making </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">27-09-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 344</span> </div> </li> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="3"> <a itemprop="item url" href="http://mediabagus.com/post/the-benefit-of-software-development-service-for-your" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">The Benefit Of Software Development Service For Your Business Growth </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">25-09-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 327</span> </div> </li> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="4"> <a itemprop="item url" href="http://mediabagus.com/post/apakah-seo-specialist-harus-bisa-coding-ini-jawabannya" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">Apakah Seo Specialist Harus Bisa Coding Ini Jawabannya </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">25-09-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 321</span> </div> </li> <li class="my mz gt na b nb nc nd ne nf ng nh ni nj nk nl nm nn no np nq nr ns nt nu nv gm bj" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <meta itemprop="position" content="5"> <a itemprop="item url" href="http://mediabagus.com/post/debugging-tool-definition-detailed-explanation-software" class="be gu ht yi yj or os hw yk yl ou nz ym yn yo yp od yq yr ys yt oh yu yv yw yx xi xk xl xn xp bj"><span itemprop="name">Debugging Tool Definition Detailed Explanation Software Glossary Terms </span></a> <div class="ni nj nl nm ab q be b du z dt"> <span class="l kk du">24-09-2024</span> <span class="l kk du kp"><svg width="20" height="20" viewBox="0 0 24 24" aria-label="clap"> <path stroke="currentColor" stroke-width="2" d="M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z"/> <path stroke="currentColor" stroke-width="2" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/> </svg> 268</span> </div> </li> </ul> </div> </div> <footer class="qa qb qc qd qe qf qg qh qi ab q qj qk c"></footer> </div> </div> </div> </div> <script> window.addEventListener("DOMContentLoaded", (event) => { const ellHljs = document.createElement("script"); ellHljs.setAttribute("src","/js/highlight.min.js"); ellHljs.onload = ()=>{ hljs.highlightAll(); }; document.querySelector("body").append(ellHljs); }); </script>   </body> </html>