Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #19 from Aviii10/main
Added a gymwebsite
- Loading branch information
Showing
7 changed files
with
176 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
This is a basic Gymwebsite easy for beginers to understand made using basic HTML and CSS. Feel free to learn from this. |
Empty file.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,175 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
|
||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<meta http-equiv="X-UA-Compatible" content="ie=edge"> | ||
<title>Abhinav Fitness</title> | ||
</head> | ||
<link href="https://fonts.googleapis.com/css?family=Baloo+Bhai&display=swap" rel="stylesheet"> | ||
<link rel="stylesheet" href="css/style.css"> | ||
<style> | ||
/*CSS RESET*/ | ||
body { | ||
font-family: 'Baloo Bhai', cursive; | ||
color: white; | ||
margin: 0px; | ||
padding: 0px; | ||
background-image: url(/gymwebsite/img/bg.jpg); | ||
background-size: 100%; | ||
} | ||
|
||
.left { | ||
position: absolute; | ||
left: 34px; | ||
top: 29px; | ||
display: inline-block; | ||
/* border: 2px solid red; */ | ||
} | ||
|
||
.left div { | ||
line-height: 19px; | ||
font-size: 16px; | ||
text-align: center; | ||
text-align: center; | ||
} | ||
|
||
.left img { | ||
width: 115px; | ||
height: auto; | ||
position: center; | ||
} | ||
|
||
.mid { | ||
display: block; | ||
width: 50%; | ||
margin: 29px auto; | ||
/* border: 2px solid green; */ | ||
} | ||
|
||
.right { | ||
position: absolute; | ||
right: 34px; | ||
top: 29px; | ||
display: inline-block; | ||
/* border: 2px solid yellow; */ | ||
font-size: 20px; | ||
} | ||
|
||
.btn { | ||
font-family: 'Baloo Bhai', cursive; | ||
margin: 0px 9px; | ||
background-color: white; | ||
padding: 4px 14px; | ||
border: 2px soild grey; | ||
border-radius: 10px; | ||
cursor: pointer; | ||
} | ||
|
||
.btn:hover { | ||
background-color: rgb(77, 72, 72); | ||
} | ||
|
||
.navbar { | ||
display: inline-block; | ||
} | ||
|
||
.navbar li { | ||
display: inline-block; | ||
font-size: 25px; | ||
} | ||
|
||
.navbar li a { | ||
color: white; | ||
text-decoration: none; | ||
padding: 34px 23px; | ||
} | ||
|
||
.navbar li a:hover,.navbar li a.active { | ||
color: grey; | ||
text-decoration: underline; | ||
} | ||
|
||
.container { | ||
border: 2px solid white; | ||
margin: 100px 450px; | ||
padding: 75px; | ||
width: 33%; | ||
border-radius: 28px; | ||
} | ||
|
||
.form-group input { | ||
font-family: 'Baloo Bhai', cursive; | ||
text-align: center; | ||
display: block; | ||
width: 508px; | ||
padding: 1px; | ||
border: 2px solid black; | ||
margin: 11px auto; | ||
font-size: 25px; | ||
border-radius: 8px; | ||
} | ||
|
||
.container h1 { | ||
text-align: center; | ||
} | ||
|
||
.container button { | ||
display: block; | ||
width: 35%; | ||
margin: 20px auto; | ||
} | ||
</style> | ||
|
||
<body> | ||
<header class="header"> | ||
<!--left box for logo--> | ||
<div class="left"> | ||
<img src=/gymwebsite/img/cc.jpg alt="" class=""> | ||
<div> | ||
Abhinav Fitness | ||
</div> | ||
</div> | ||
<!--lmid box for logo--> | ||
<div class="mid"> | ||
<ul class="navbar"> | ||
<li><a href="#" class="active">Home</a></li> | ||
<li><a href="#">About Us</a></li> | ||
<li><a href="#">Fitness Calculator</a></li> | ||
<li><a href="#">Contact Us</a></li> | ||
</ul> | ||
</div> | ||
<!--lright box for logo--> | ||
<div class="right"> | ||
<button class="btn">Call Us Now</button> | ||
<button class="btn">E-Mail Us</button> | ||
</div> | ||
</header> | ||
<div class="container"> | ||
<h1>JOIN THE BEST GYM OF THE CITY NOW!!!!</h1> | ||
<form action="noaction.php"> | ||
<div class="form-group"> | ||
<input type="text" name="" placeholder="Enter Your Name"> | ||
</div> | ||
<div class="form-group"> | ||
<input type="text" name="" placeholder="Enter Your Age"> | ||
</div> | ||
<div class="form-group"> | ||
<input type="text" name="" placeholder="Enter Your Gender"> | ||
</div> | ||
<div class="form-group"> | ||
<input type="text" name="" placeholder="Enter Your Locality"> | ||
</div> | ||
<div class="form-group"> | ||
<input type="text" name="" placeholder="Enter Your E-Mail Id"> | ||
</div> | ||
<div class="form-group"> | ||
<input type="text" name="" placeholder="Enter Your Phone No."> | ||
</div> | ||
<button class="btn">Submit</button> | ||
</form> | ||
</div> | ||
</body> | ||
|
||
</html> |
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.