Skip to content

Commit eef9ef3

Browse files
HuXn-WebDevHuXn-WebDev
committed
Construction Landing Page (HTML & CSS)
1 parent 312ba86 commit eef9ef3

File tree

7 files changed

+534
-0
lines changed

7 files changed

+534
-0
lines changed

‎90. Construction Landing Page/Images/Zayn.jpg

2.62 MB
Loading

‎90. Construction Landing Page/Images/one.jpg

2.04 MB
Loading

‎90. Construction Landing Page/Images/scott-blake-x-ghf9LjrVg-unsplash.jpg

4.08 MB
Loading

‎90. Construction Landing Page/Images/three.jpg

2.2 MB
Loading

‎90. Construction Landing Page/Images/two.jpg

2.65 MB
Loading

‎90. Construction Landing Page/index.html

Lines changed: 243 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,243 @@
1+
>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Dream Hometitle>
8+
<link rel="stylesheet" href="style.css" />
9+
head>
10+
<body>
11+
12+
<nav class="nav">
13+
<div class="nav__logo">
14+
<h1>D<span>Hspan>h1>
15+
div>
16+
<ul>
17+
<li class="list-items"><a href="#">Homea>li>
18+
<li class="list-items"><a href="#services">Servicesa>li>
19+
<li class="list-items"><a href="#why-us">Why Us?a>li>
20+
<li class="list-items"><a href="#project-details">Project Detailsa>li>
21+
ul>
22+
nav>
23+
<header class="hero">
24+
<section class="hero__headings-container">
25+
<h3>Build <span>Yourspan>h3>
26+
<h1 class="hero__main-headings">
27+
DREAM <span class="main-span">HOMEspan>
28+
h1>
29+
<p>WE CONSTRUCT YOUR FUTUREp>
30+
<a href="#" class="main-btn">Learn Morea>
31+
section>
32+
header>
33+
34+
<h1 class="main-headings center">
35+
OUR <span class="main-span">SERVICESspan>
36+
h1>
37+
38+
39+
<section class="services" id="services">
40+
41+
<section class="cards">
42+
<div class="card">
43+
<div class="card-image img-one">div>
44+
<p>Constructionp>
45+
div>
46+
<div class="card">
47+
<div class="card-image img-two">div>
48+
<p>ARCHITECTURE PLANINGp>
49+
div>
50+
<div class="card">
51+
<div class="card-image img-three">div>
52+
<p>CONSULTANCYp>
53+
div>
54+
section>
55+
section>
56+
57+
<h1 class="main-headings">WHY CHOOSE<span class="main-span"> US?span>h1>
58+
59+
60+
<section class="why-us" id="why-us">
61+
<div class="lists-container">
62+
<div class="list">
63+
<div class="list-number">
64+
<p>1p>
65+
div>
66+
<p class="list-info">HIGH QUALIFIED & TECHNICAL PROFESSIONALSp>
67+
div>
68+
<div class="list">
69+
<div class="list-number">
70+
<p>2p>
71+
div>
72+
<p class="list-info">ADVANCE PLANINGp>
73+
div>
74+
<div class="list">
75+
<div class="list-number">
76+
<p>3p>
77+
div>
78+
<p class="list-info">STABILITY RESOURCES & EXPERTIESp>
79+
div>
80+
<div class="list">
81+
<div class="list-number">
82+
<p>4p>
83+
div>
84+
<p class="list-info">PASSION, INTEGRITY, & PUNCTUALITYp>
85+
div>
86+
<div class="list">
87+
<div class="list-number">
88+
<p>5p>
89+
div>
90+
<p class="list-info">BREADTH OF SERVICESp>
91+
div>
92+
div>
93+
<div class="owner-image-container">
94+
<div class="owner-image">div>
95+
div>
96+
section>
97+
98+
<h1 class="main-headings center">
99+
PROJECT <span class="main-span">#DETAILSspan>
100+
h1>
101+
102+
103+
<section class="project-details" id="project-details">
104+
<section class="project-details__container-left">
105+
<div class="img-container">
106+
<div class="card-image project-details-img img-one">div>
107+
div>
108+
<section class="details">
109+
<p class="title">ARCHITECTURE DESIGNp>
110+
<div class="list">
111+
<div class="list-number">
112+
<p>1p>
113+
div>
114+
<p class="list-info">2D & 3D MODELINGp>
115+
div>
116+
<div class="list">
117+
<div class="list-number">
118+
<p>2p>
119+
div>
120+
<p class="list-info">INTERIAL & EXTERIOR DESIGNp>
121+
div>
122+
<div class="list">
123+
<div class="list-number">
124+
<p>3p>
125+
div>
126+
<p class="list-info">LANDSCAPING & OUTDOOR GARDENINGp>
127+
div>
128+
<div class="list">
129+
<div class="list-number">
130+
<p>4p>
131+
div>
132+
<p class="list-info">
133+
ELECTRICAL, PLUMBING & SEWERAGE DRAWING PLANE.
134+
p>
135+
div>
136+
<div class="list">
137+
<div class="list-number">
138+
<p>5p>
139+
div>
140+
<p class="list-info">SOIL INVESTIGATIONp>
141+
div>
142+
section>
143+
section>
144+
145+
<section class="project-details__container-right">
146+
<section class="details">
147+
<p class="title">CONSTRUCTIONp>
148+
149+
<div class="list">
150+
<div class="list-number">
151+
<p>1p>
152+
div>
153+
<p class="list-info">RESIDENTIAL & COMMERCIAL PROJECTSp>
154+
div>
155+
<div class="list">
156+
<div class="list-number">
157+
<p>2p>
158+
div>
159+
<p class="list-info">TURNKEY PROJECT (WITH MATERIAL)p>
160+
div>
161+
<div class="list">
162+
<div class="list-number">
163+
<p>3p>
164+
div>
165+
<p class="list-info">LANDSCAPING & OUTDOOR GARDENINGp>
166+
div>
167+
<div class="list">
168+
<div class="list-number">
169+
<p>4p>
170+
div>
171+
<p class="list-info">DEMOLATIONp>
172+
div>
173+
<div class="list">
174+
<div class="list-number">
175+
<p>5p>
176+
div>
177+
<p class="list-info">RENOVATION & RE-CONSTRUCTIONp>
178+
div>
179+
section>
180+
<div class="img-container">
181+
<div class="card-image project-details-img img-two">div>
182+
div>
183+
section>
184+
185+
186+
<section class="project-details__container-left">
187+
<div class="img-container">
188+
<div class="card-image project-details-img img-three">div>
189+
div>
190+
<section class="details">
191+
<p class="title">REAL ESTATEp>
192+
<div class="list">
193+
<div class="list-number">
194+
<p>1p>
195+
div>
196+
<p class="list-info">
197+
B - 17 MULTI GARDENp>
198+
div>
199+
<div class="list">
200+
<div class="list-number">
201+
<p>2p>
202+
div>
203+
<p class="list-info">PARK VIEW CITYp>
204+
div>
205+
<div class="list">
206+
<div class="list-number">
207+
<p>3p>
208+
div>
209+
<p class="list-info">BEAUTY OF HILLSp>
210+
div>
211+
<div class="list">
212+
<div class="list-number">
213+
<p>4p>
214+
div>
215+
<p class="list-info">
216+
FAISAL MARGALLAH CITY.
217+
p>
218+
div>
219+
<div class="list">
220+
<div class="list-number">
221+
<p>5p>
222+
div>
223+
<p class="list-info">BLUE WORLD CITYp>
224+
div>
225+
section>
226+
section>
227+
228+
<form>
229+
<input type="text" placeholder="John Doe">
230+
<input type="email" placeholder="Email">
231+
<input type="password" placeholder="Password">
232+
<a href="#" class="form-btn">Submita>
233+
form>
234+
235+
<footer>
236+
<a href="#">Abouta>
237+
<a href="#">Terms of Usea>
238+
<a href="#">Privacy Policya>
239+
<a href="#">Careersa>
240+
<a href="#">Contact Usa>
241+
footer>
242+
body>
243+
html>

0 commit comments

Comments
 (0)