commit ce7bdeb3e9bad1bd9343106338eba8ae1868f697
Author: Harilee <45534309+harilee1325@users.noreply.github.com>
Date: Fri Oct 27 15:44:45 2023 +0530
first commit
diff --git a/css.html b/css.html
new file mode 100644
index 0000000..b4385c2
--- /dev/null
+++ b/css.html
@@ -0,0 +1,55 @@
+
+
+
+
+
+
+ My First CSS Example
+ This is a paragraph.
+
+ Red and center-aligned heading
+ Red and center-aligned paragraph.
+
+ Hello World!
+ This paragraph is not affected by the style.
+
+
+ - Coffee
+ - Tea
+ - Coca Cola
+
+
+
+ - Coffee
+ - Tea
+ - Coca Cola
+
+
+ This is a heading
+ This is a paragraph.
+
+
+ This div element has a top margin of 100px, a right margin of 150px, a bottom margin of 100px, and a left margin of 80px.
+
+ This div element has a top padding of 50px, a right padding of 30px, a bottom padding of 50px, and a left padding of 80px.
+
+
+
+
+ - Table
+ - Chair
+ - Bed
+
+
+
+
+
+
+
+
This is a heading
+ This is a heading
+ This is a heading
+
+
+
+
diff --git a/external.css b/external.css
new file mode 100644
index 0000000..49e6f30
--- /dev/null
+++ b/external.css
@@ -0,0 +1,131 @@
+body {
+ background-color: lightblue;
+ }
+
+ h1 {
+ color: white;
+ text-align: center;
+ }
+
+ p {
+ font-family: verdana;
+ font-size: 20px;
+ }
+
+ /*
+ class selector
+ */
+ .center {
+ text-align: center;
+ color: red;
+ }
+
+ /*
+ id selector
+ */
+ #para1 {
+ text-align: center;
+ color: red;
+ }
+
+ /*
+ list styling
+ */
+
+ ol {
+ background: #ff9999;
+ padding: 20px;
+
+ }
+
+ ul {
+ background: #3399ff;
+ padding: 20px;
+ }
+
+ ol li {
+ background: #ffe5e5;
+ color: darkred;
+ padding: 5px;
+ margin-left: 35px;
+ }
+
+ ul li {
+ background: #cce5ff;
+ color: darkblue;
+ margin: 5px;
+ }
+
+ /*
+ margin example
+ */
+
+ #margin_example {
+ border: 1px solid black;
+ margin-top: 100px;
+ margin-bottom: 100px;
+ margin-right: 150px;
+ margin-left: 80px;
+ background-color: lightblue;
+ }
+
+ /*
+ padding example
+ */
+
+ #padding_example {
+ border: 1px solid black;
+ background-color: lightblue;
+ padding-top: 50px;
+ padding-right: 30px;
+ padding-bottom: 50px;
+ padding-left: 80px;
+ }
+
+ /*
+ centering items using margin auto
+ */
+
+ #center_table {
+ background: #ff9999;
+ padding: 20px;
+ margin: 50px auto;
+ width: 200px;
+ height: 100px;
+ }
+
+ /*
+ centering with flex box horizontally
+ */
+
+ .center_horizontal_flex_box {
+ font-family: arial;
+ font-size: 24px;
+ margin: 25px;
+ width: 1050px;
+ height: 200px;
+ outline: dashed 1px black;
+ /* Center child horizontally*/
+ display: flex;
+ justify-content: center;
+ }
+
+ .child {
+ width: 50px;
+ height: 50px;
+ background-color: red;
+ }
+
+ .center_vertical_flex_box {
+ font-family: arial;
+ font-size: 24px;
+ margin: 25px;
+ width: 1050px;
+ height: 200px;
+ outline: dashed 1px black;
+ /* Center vertically */
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ }
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..9bbfc96
--- /dev/null
+++ b/index.html
@@ -0,0 +1,98 @@
+
+
+
+ Page Title
+
+
+
+
+ Heading 1
+ Heading 2
+ Heading 3
+ Heading 4
+ Heading 5
+ Heading 6
+
+
+
+ Visit W3Schools
+
+
+
+
+ This paragraph contains a lot of lines in the source code, but the browser
+ ignores it.
+
+
+
+ This is heading 1
+ This is some text.
+
+ This is heading 2
+ This is some other text.
+
+
+
+ This is
a paragraph
with line breaks.
+
+
+
+ This is a heading
+ This is a paragraph.
+
+ This is a heading
+ This is a paragraph.
+
+ This is a heading
+ This is a paragraph.
+
+
+
+
+
+ | Company |
+ Contact |
+ Country |
+
+
+ | Alfreds Futterkiste |
+ Maria Anders |
+ Germany |
+
+
+ | Centro comercial Moctezuma |
+ Francisco Chang |
+ Mexico |
+
+
+
+
+
+
+
+
+
+ - Coffee
+ - Tea
+ - Milk
+
+
+
+
+ - Coffee
+ - - black hot drink
+ - Milk
+ - - white cold drink
+
+
+
diff --git a/middle_part/middle_part.css b/middle_part/middle_part.css
new file mode 100644
index 0000000..e69de29
diff --git a/middle_part/middle_part.html b/middle_part/middle_part.html
new file mode 100644
index 0000000..e69de29
diff --git a/nav_bar/img/logo.png b/nav_bar/img/logo.png
new file mode 100644
index 0000000..33d06e8
Binary files /dev/null and b/nav_bar/img/logo.png differ
diff --git a/nav_bar/nav_bar.css b/nav_bar/nav_bar.css
new file mode 100644
index 0000000..3edf825
--- /dev/null
+++ b/nav_bar/nav_bar.css
@@ -0,0 +1,38 @@
+body {
+ margin: 0;
+ font-family: Arial, Helvetica, sans-serif;
+ }
+
+ .topnav {
+ overflow: hidden;
+ background-color: #FFFF;
+ }
+
+ .topnav a {
+ float: left;
+ color: black;
+ text-align: end;
+ padding: 14px 16px;
+ text-decoration: none;
+ font-size: 15px;
+ }
+
+ .topnav a:hover {
+ color: red;
+ }
+
+ .topnav a.active {
+ color: red;
+ }
+
+ .logo {
+ width: 200px;
+ height: 50px;
+ padding-right: 480px;
+ padding-left: 30px;
+ }
+
+ .header-container{
+ display: flex;
+ align-items: center;
+ }
\ No newline at end of file
diff --git a/nav_bar/nav_bar.html b/nav_bar/nav_bar.html
new file mode 100644
index 0000000..5d7b8cf
--- /dev/null
+++ b/nav_bar/nav_bar.html
@@ -0,0 +1,26 @@
+
+
+
+
+
+
+
+
+
+
diff --git a/top_header/img/doctor_img.png b/top_header/img/doctor_img.png
new file mode 100644
index 0000000..e1b5063
Binary files /dev/null and b/top_header/img/doctor_img.png differ
diff --git a/top_header/top_header.css b/top_header/top_header.css
new file mode 100644
index 0000000..893710d
--- /dev/null
+++ b/top_header/top_header.css
@@ -0,0 +1,113 @@
+body {
+ margin: 0;
+ font-family: Arial, Helvetica, sans-serif;
+ }
+
+ .topnav {
+ margin-top: 30px;
+ overflow: hidden;
+ background-color: #FFFF;
+ }
+
+ .topnav a {
+ float: left;
+ color: black;
+ text-align: end;
+ padding: 14px 16px;
+ text-decoration: none;
+ font-size: 15px;
+ }
+
+ .topnav a:hover {
+ color: red;
+ }
+
+ .topnav a.active {
+ color: red;
+ }
+
+ .logo {
+ width: 200px;
+ height: 50px;
+ padding-right: 480px;
+ padding-left: 30px;
+ }
+
+ .header-container{
+ display: flex;
+ align-items: center;
+ }
+
+
+ .doctor_img {
+ width: 95vw;
+ margin-left: 30px;
+ margin-right: 30px;
+ margin-top: 50px;
+
+ }
+
+ .title_1{
+ width: 250px;
+ margin-left: 100px;
+ margin-top: -400px;
+ font-size: 20;
+ }
+
+ h3 {
+ width: 500px;
+ color: rgb(181, 181, 181);
+ font-size: 10;
+ font-weight: lighter;
+
+ }
+
+ .book-appointment{
+ background-color: white;
+ border-radius: 10px;
+ box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
+ transition: 0.3s;
+ width: 75%;
+ position: absolute;
+ top: 110%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+
+ }
+
+ h4 {
+ margin-left: 20px;
+ padding-top: 10px;
+ }
+
+
+ .rounded-input {
+ border: 1px solid #ccc;
+ border-radius: 10px; /* Adjust this value to change the radius */
+ padding: 5px;
+ width: 30%;
+ height: 35px; /* Set the width of each input field */
+ margin: 1%; /* Add some margin for spacing */
+}
+
+/* Style for the container div */
+.input-container {
+ display: flex; /* Make the children flex items */
+ justify-content: space-between; /* Space the children equally */
+ margin-bottom: 10px; /* Add some margin for spacing */
+}
+
+
+/* Style for the "Book Appointment" button */
+.book-appointment-button {
+ background-color: #17C1A3;
+ border-color: white;
+ color: white;
+ border-radius: 10px;
+ padding: 5px;
+ width: 30%;
+ height: 50px;
+ margin: 1%;
+ cursor: pointer;
+ outline: none;
+}
\ No newline at end of file
diff --git a/top_header/top_header.html b/top_header/top_header.html
new file mode 100644
index 0000000..b5cb2f0
--- /dev/null
+++ b/top_header/top_header.html
@@ -0,0 +1,61 @@
+
+
+
+
+
+
+
+
+
+