-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcss position 8.html
42 lines (36 loc) · 8.11 KB
/
css position 8.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>css position 8</title>
<style>
.con{position: relative;}
.box{width: 40%;position: relative;margin-top: -55%;background-color: azure;margin-left: 25%;box-shadow: 66px #e28181;}
textarea{width: 99%;border: none;border-bottom: solid 1px;margin-bottom: 3px;}
#xx,#ll,#zz{border: none;border-bottom: solid 1px;margin-left: 10px;}
.oo{background-color: blue;color: antiquewhite;font-size: x-large;}
.bb{text-align: center;}
.con{opacity: 0.7;}
.box{opacity: 0;}
.box:hover{opacity: 1;}
</style>
</head>
<body>
<div class="con">
<h1>FULL STACK WEB DEVELOPMENT</h1>
<P>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Odio accusantium exercitationem officiis doloremque necessitatibus recusandae nihil natus iste facere non. Aliquam voluptas illo rem, magni quis eius quibusdam culpa corrupti suscipit, quidem vitae molestiae totam minima provident! Praesentium nulla maxime, et doloremque eaque magnam eos, accusantium dignissimos expedita adipisci dolor. Veritatis eveniet nobis ea nam repellendus necessitatibus incidunt fuga quae reiciendis atque recusandae voluptatibus assumenda eos velit molestiae iusto odio libero praesentium suscipit, harum, facere vel blanditiis debitis cupiditate! Facilis reprehenderit dolores mollitia sunt, tempora rerum, illum fuga, dolor deserunt necessitatibus esse perspiciatis error suscipit consequatur totam unde. Eius, tempore.</P>
<h1>COURSE DETAILS</h1>
<P>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Consectetur omnis rerum consequuntur numquam alias nisi, corrupti dolorum ratione blanditiis debitis non, nulla accusamus. Vel quidem accusantium possimus, odit omnis assumenda numquam ad voluptatum maxime esse obcaecati corporis itaque provident quis a dolore! Optio nobis minima autem ratione veniam? Delectus assumenda laborum voluptatem aliquid tempora, cupiditate consequatur dolor atque iure tempore quibusdam similique iusto itaque odit asperiores, laboriosam, eos totam. Minima, aliquid cupiditate soluta accusantium itaque, excepturi, corrupti officia dolore sed vitae aut autem repellendus quibusdam eaque molestiae quos necessitatibus? Non corrupti omnis temporibus saepe sint aliquid velit molestias voluptas, incidunt doloribus laudantium quam, dolorum distinctio ipsa. Odit expedita omnis nostrum sapiente perspiciatis deserunt rem incidunt recusandae voluptatibus animi ullam est, voluptatem vitae aliquam cumque autem porro laboriosam tenetur dolor! Cumque officia suscipit rem voluptatum soluta consequuntur, perferendis iste quos eligendi maiores debitis magni necessitatibus, accusamus expedita ex omnis ad reiciendis fugiat quisquam obcaecati laboriosam, id autem quis! Nemo soluta dicta quam veritatis veniam quo recusandae reprehenderit amet! Id voluptatum dolores, modi quae recusandae vitae! Esse facilis labore repellat, error est quo placeat nulla quos culpa beatae consectetur vel assumenda nemo reprehenderit! Ipsa ad molestiae est deleniti atque nam dolore asperiores perspiciatis nostrum quis. Error harum praesentium accusantium molestias, rem nulla sapiente similique corporis iusto sequi atque tempora eligendi quo assumenda repudiandae inventore vitae aliquid laudantium provident. Voluptatum distinctio debitis earum soluta magni nam architecto assumenda, id obcaecati ipsam. Hic, corrupti. Minima eos ex dignissimos, eligendi, adipisci debitis vero veritatis sunt iste cum placeat ullam nesciunt cupiditate iusto odit possimus harum corporis repellendus molestias, labore ipsa optio. Voluptatum, earum laborum ex neque aliquam excepturi saepe nisi at facere debitis officia sit. Illo blanditiis similique fuga, quaerat, dolores at ratione alias expedita neque beatae eveniet quia cum error ad fugit porro quis est explicabo culpa cumque exercitationem, reprehenderit voluptates repellat. Ducimus molestias nostrum alias illum, assumenda reiciendis sint magnam porro aut deleniti a deserunt aspernatur veniam suscipit libero eius, ipsa aliquid voluptas quidem. Fugit, error harum! Voluptates provident veniam, unde eaque at rerum modi velit et quod libero eos quisquam dolor explicabo necessitatibus recusandae ullam beatae illum id? Quibusdam quos, tempore earum libero harum non eligendi fugit autem delectus adipisci corrupti distinctio eos? Doloribus accusantium, fugit sed eveniet quos voluptates blanditiis! Tempora maxime quas recusandae aperiam illum, soluta culpa eveniet vel accusantium, deserunt cum quaerat velit molestias rerum illo magni nobis blanditiis consectetur repudiandae sed perferendis? Distinctio odio, natus dolor pariatur debitis sit quas quaerat nemo tenetur quod tempore minus, mollitia quia tempora perspiciatis illum. Maxime labore asperiores quo pariatur iusto iste, culpa dolore quis quasi illo inventore excepturi praesentium provident omnis in hic nesciunt perspiciatis officia. Dolorum cum, doloribus eius quasi necessitatibus nobis veniam ducimus fuga id, nisi pariatur ab eos ea. Molestiae perspiciatis veritatis non eum dolorum exercitationem at obcaecati rem, ratione mollitia omnis ab tempora placeat quibusdam natus minus cupiditate doloribus? Perferendis unde aliquid obcaecati in quibusdam, maiores modi, consequuntur, fugiat aliquam corporis neque temporibus sunt voluptatibus sapiente commodi Lorem ipsum dolor sit amet consectetur adipisicing elit. Sequi enim fugiat ex dolores, sit rerum quisquam non dolor nisi aliquid sapiente omnis officiis aliquam eius eaque. Est recusandae maxime, nemo quisquam dolore similique temporibus a optio asperiores deleniti natus ea amet pariatur. Perferendis odit libero doloremque consequatur laboriosam a doloribus suscipit! Magnam excepturi iure doloribus autem itaque velit illo sed, praesentium facere, eaque ex officia quo esse officiis amet laborum iste neque consequuntur tempore in. A assumenda architecto quae voluptatibus molestiae iste enim, ea quia tempora. Laboriosam illum unde, eaque tempore atque iste hic reprehenderit est, nostrum, recusandae pariatur dolorum Lorem ipsum dolor sit amet consectetur adipisicing elit. Vel totam voluptatem cupiditate a, at veniam ipsa odio provident! Eaque dolorum dolorem quia id amet vitae culpa voluptates temporibus soluta accusamus, sunt aut quaerat tempora voluptatum. Consequatur ipsa accusamus harum, minus unde quae tenetur quibusdam, reiciendis optio ducimus possimus. Ut, dicta soluta ullam ab consectetur, odit optio dolores, doloribus quam non aliquid tenetur laborum asperiores odio. Minima soluta veritatis magnam totam reiciendis ad quod amet accusamus sit saepe laudantium consequatur provident tempore deleniti, doloribus quae facere voluptatem harum ipsam eligendi quasi dolor perferendis quas illum! A consectetur eos facere voluptatum rem cum quasi temporibus exercitationem inventore! Unde, enim nobis! Aliquid ex blanditiis iusto possimus velit, vero animi eveniet? Repudiandae distinctio sit itaque officiis laboriosam ad modi facere non numquam dicta ipsam earum error adipisci temporibus aliquam, dolor voluptate consequuntur velit delectus inventore reiciendis asperiores, excepturi laudantium perferendis. Rem, sit architecto! Officiis voluptate assumenda exercitationem, repellendus quidem animi numquam. Non qui alias dolore cumque eum nam? Mollitia quibusdam esse enim unde sequi culpa ducimus voluptatum natus accusamus commodi neque facere consectetur iusto voluptates, quia praesentium repudiandae ab accusantium aspernatur incidunt repellat deleniti sit! Repellat impedit neque voluptatum repellendus aliquid ipsa, perferendis assumenda.</P>
</div>
<div class="box">
<div class="bb"><h2>WANT A FREE CONSULTATION</h2></div><br><br>
<div class="hh">
<input type="text" placeholder=" Full name" id="xx"><br><br>
<input type="email" name="mail" id="ll" placeholder="email">
<input type="number" name="contact no." id="zz" placeholder="contact no."><br><br><br><br>
<textarea name="message" id="pp" cols="65" rows="10">Message</textarea>
<input type="button" value="send message" class="oo"></div>
</div>
</body>
</html>