Files
w11_01_Nathan_personalPage/hobbies.html
T

92 lines
3.2 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hobbies</title>
<!-- External CSS : Mengatur seluruh style dari Hobbies-->
<link rel="stylesheet" href="hobbies.css">
</head>
<body>
<!-- Navigation menu untuk berpindah antar halaman website, semua halaman menggunakan navigation yang sama -->
<header class="header">
<nav class="nav">
<ul class="nav-list">
<li >Home</a></li>
<li><a href="about.html" target="_self" title="About me">About</a></li>
<li><a href="hobbies.html" target="_self" title="Hobbies">Hobbies</a></li>
<li><a href="gallery.html" target="_self" title="Gallery">Gallery</a></li>
<li><a href="contact.html" target="_self" title="Contact">Contact</a></li>
</ul>
</nav>
</header>
<main class="hobbies-main">
<h1 class="page-title">My Hobbies</h1>
<p class="page-intro">
Everyone has their own way to enjoy their free time.
Here are some of my favourite activities.
</p>
<!-- Hobby section: menampilkan tiga hobi beserta foto dan deskripsinya -->
<section class="hobbies-container">
<article class="hobby-item">
<img src="images/video-games.jpg"
alt="Foto saya sedang bermain video game">
<div class="hobby-content">
<h2>Playing Video Games</h2>
<p>
I enjoy playing video games during my free time.
Gaming helps me relax and gives me an opportunity
to explore different worlds and challenges.
</p>
</div>
</article>
<article class="hobby-item">
<img src="images/drawing.jpg"
alt="Foto saya sedang menggambar">
<div class="hobby-content">
<h2>Drawing</h2>
<p>
Drawing is one of my favourite creative activities.
I enjoy drawing different things and expressing
my ideas through illustrations.
</p>
</div>
</article>
<article class="hobby-item">
<img src="images/piano.jpg"
alt="Foto saya sedang bermain piano">
<div class="hobby-content">
<h2>Playing the Piano</h2>
<p>
I occasionally play the piano during my free time.
It is a fun activity that allows me to enjoy music
and practice my musical skills.
</p>
</div>
</article>
</section>
</main>
<footer class="footer">
<p>Author: Nathan Handoko</p>
<p>
Email:
<a href="mailto:nathan-h.inf25@ukwms.ac.id">
nathan-h.inf25@ukwms.ac.id
</a>
</p>
<p>Phone Number: 0851-0270-5905</p>
</footer>
</body>
</html>