Video narration
Here’s a simple personal portfolio top section: a navigation bar and a hero section—the first thing visitors see, and your first impression. In the HTML, we start with a nav. Inside it, a logo area shows your name, then an unordered list with links: Home, About, Skills, Projects, and Contact. Each link points to a section id, like #home for the hero. Next is section id="home" with class "hero". It contains an image with class "profile-img", an h1 like “Hi, I’m [Your Name]”, a short paragraph for your role—Web Developer, Designer, Creator—and a primary call-to-action button: an a tag with class "btn". CSS brings it to life: the navbar uses flex to space items, with a dark blue background and a blue accent for hover. The hero is centered on a gradient background, the profile photo is circular, and the button stands out. When you click “Contact Me,” it jumps to the Contact section via the #contact link.