Scribd
Upload
9 views

Doctype HTML

Uploaded by

GURU PRASANTH V III D - 0034
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
9 views

Doctype HTML

Uploaded by

GURU PRASANTH V III D - 0034
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

<!

DOCTYPE html>

<html lang="en">

<head>

<title>guru prasanth</title>

<style>

/* Reset default browser styles */

*{

margin: 0;

padding: 0;

box-sizing: border-box;

body {

font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

background-color: #f4f4f4;

color: #333;

header {

background: #333;

color: #fff;

padding: 1rem;

text-align: center;

position: fixed;

width: 100%;

top: 0;

left: 0;

z-index: 1000;

nav ul {

list-style-type: none;

}
nav ul li {

display: inline;

margin: 0 15px;

nav ul li a {

color: #fff;

text-decoration: none;

main {

padding: 100px 20px 20px;

text-align: center;

.hero {

background: url('https://via.placeholder.com/1200x400') no-repeat center center/cover;

color: #fff;

padding: 60px 20px;

text-align: center;

.hero h1 {

font-size: 3rem;

.card-container {

display: flex;

justify-content: center;

flex-wrap: wrap;

gap: 20px;

margin: 20px 0;

.card {

background: #fff;

border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

overflow: hidden;

width: 300px;

.card img {

width: 100%;

height: auto;

.card-content {

padding: 20px;

.card-content h2 {

margin-bottom: 10px;

font-size: 1.5rem;

.card-content p {

font-size: 1rem;

color: #666;

footer {

background: #333;

color: #fff;

padding: 20px;

text-align: center;

</style>

</head>

<body>

<header>

<nav>

<ul>
<li><a href="#">Home</a></li>

<li><a href="#">About</a></li>

<li><a href="#">Services</a></li>

<li><a href="#">Contact</a></li>

</ul>

</nav>

</header>

<main>

<section class="hero">

<h1>I'M GURU PRASANTH</h1>

<p>Your success is our priority. Explore our offerings and see how we can help you achieve
your goals.</p>

</section>

<section class="card-container">

<div class="card">

<img src="https://via.placeholder.com/300x200" alt="Service 1">

<div class="card-content">

<h2>developer</h2>

<p>Software developers design, program, build, deploy and maintain software using
many different skills and tools.</p>

</div>

</div>

<div class="card">

<img src="https://via.placeholder.com/300x200" alt="Service 2">

<div class="card-content">

<h2>Affiliate marketing</h2>

<p>Affiliate marketing is a type of advertising where a company pays third-party


publishers, called affiliates, to promote their products and services</p>

</div>

</div>

<div class="card">

<img src="https://via.placeholder.com/300x200" alt="Service 3">


<div class="card-content">

<h2>trader</h2>

<p>A trader is an individual who engages in the buying and selling of assets in any
financial market, either for themself or on behalf of another person or institution.</p>

</div>

</div>

</section>

</main>

<footer>

<p>&copy; 2024 guru prasanth Web Page. All rights reserved.</p>

</footer>

</body>

</html>

You might also like