HTML and CSS With four section

HTML Structur

head Section

Meta Tags: Specifies the character set and viewport settings.

Stylesheet Link: Links the HTML file to an external CSS file (styles.css).

Title: Sets the title of the webpage.

body Section

Landing Section (#landing)-1

Contains a <section> with the ID landing

Displays a welcome heading (<h1>) and a brief introductory paragraph (<p>).

Placeholder for additional content related to the landing section.

Services Section (#services)-2

Contains a <section> with the ID "services.

Displays a heading for services (<h2>) and an unordered list (<ul>) of service items (<li>).

Placeholder for adding more services.

Portfolio Section (#portfolio)-3

Contains a <section> with the ID portfolio.

Displays a heading for the portfolio (<h2>).

Placeholder for adding portfolio items, which could include images, descriptions, etc.

About Section (#about)-4

Contains a <section> with the ID about.

Displays a heading for the about section (<h2>) and a brief paragraph about Leon (<p>).

Contact Section (#contact):

Contains a <section> with the ID contact.

Displays a heading for the contact section (<h2>) and a brief paragraph about getting in touch.

Placeholder for adding a contact form, contact information, or other relevant details.

Footer Section (<footer>)-5

Contains a <footer> element.

Displays a copyright notice (<p>) with the current year and a statement.

CSS Styles (styles.css):

Resets margin and padding for the entire page (body).

Applies a default font family for better readability (body).

Styles each <section> with padding, text alignment, and a distinct background color.

Defines specific background colors for each section (#landing, #services, #portfolio, #about, #contact).

Styles the footer with a dark background color, white text, and center alignment.

Notes:

The template uses placeholder content, and you should customize it according to the specific information you want to present on each section.

Colors, fonts, and additional styling can be adjusted in the CSS file to match your design preferences.

The template is responsive and can be further enhanced with media queries for different screen sizes.