Design front page of hospital with different style sheets.
Original Title:
Hospital Website created using HTML & CSS, Computer application project
Description:
Computer Application Project submitted in IINTM , janak puri affiliated to guru gobind singh indraprastha university. Topic: HOSPITAL WEBSITE ( WE CARE HOSPITAL ) Using: HTML & CSS
Code:-
Input:-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hospitals</title>
<link rel="icon" href="https://upload.wikimedia.org/wikipedia/en/thumb/0/0e/Prince_of_Wales_Hospital_logo.svg/1920px-Prince_of_Wales_Hospital_logo.svg.png" type="image/png">
<link rel="stylesheet" href="covidcss.css">
</head>
<style>
body {
background-image: url(https://rubanpatliputrahospital.com/wp-content/uploads/2020/03/banner-3-1.jpg);
background-repeat: no-repeat;
}
.container_1 {
width: 100%;
height: 1250%;
display: flex;
flex-wrap: wrap;
justify-content: center;
background-color: rgb(224 248 235 / 94%);
padding: 100px 150px;
margin-top: 750px;
}
.item_3 {
margin: 1px 0px;
padding: 5px;
width: 350px;
height: 175px;
background-color: white;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
transition-property: background-color;
transition-duration: 1s;
}
.item_3:hover {
background-color: rgb(217, 223, 219);
width: 350px;
height: 175px;
border-radius: 40px;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
color: white;
text-shadow: 1px 1px #dae2e2;
}
.img_1 {
width: 50px;
height: 50px;
vertical-align: middle;
margin-right: 30px;
margin-left: 20px;
}
.p_call {
text-align: center;
display: inline-block;
margin-top: 30px;
}
</style>
<script>
function myfunction() {
window.open("https://rubanpatliputrahospital.com/httpsrubanpatliputrahospital-com/", "_self");
}
</script>
<body>
</div>
<header>
<div>
<div class="header-area header-transparrent ">
<div class="main-header header-sticky ">
<div class="container">
<div class="row align-items-center">
<div class="col-xl-2 col-lg-2 col-md-2" style="padding:0px;margin:0px; ">
<div class="logo">
<a href="index.html"> <img src="https://rubanpatliputrahospital.com/wp-content/uploads/elementor/thumbs/Ruban@logo-with-NABH-2-ovg23ovg0xx8ocfhzbaqtv86rfyyms5d4as9irornm.png" alt="corna image load" style="margin: 20px;margin-left: -40px;margin-right:20px;"></a>
</div>
</div>
<div class="col-xl-10 col-lg-10 col-md-10">
<div class="main-menu f-right d-none d-lg-block">
<nav>
<ul id="navigation">
<li class="active"><a onclick="myfunction()" style="cursor: pointer;"> Hospital Overview <span style="color:rgb(104, 228, 151);">+</span> </a>
</li>
<li><a href="covid_tracker.html"> Super Speciality <span style="color:rgb(104, 228, 151);">+</span></a>
</li>
<li><a href="#">Specialities <span style="color:rgb(104, 228, 151);">+</span></a>
</li>
<li><a href="medicine.html"> Facilities <span style="color:rgb(104, 228, 151);">+</span></a>
</li>
<li><a href="https://www.indiamart.com/corona-covid-19-supplies.html" target="_blank">Empanelment <span style="color:rgb(104, 228, 151);">+</span></a>
</li>
<li><a href="#">International Patient <span style="color:rgb(104, 228, 151);">+</span></a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
</body>
</html>
Output:-
Hindi
Afrikaans
Arabic
Chinese (Simplified)
Dutch
English
French
Galician
German
Gujarati
Hawaiian
Italian
Nepali
Portuguese
Punjabi
Russian
Sesotho
Spanish
1 thought on “Design front page of hospital with different style sheets”