-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcss-background.html
75 lines (59 loc) · 20.4 KB
/
css-background.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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.box{
width: 400px;
height: 400px;
padding: 50px;
border: 4px dotted blue;
/*we can also use multiple bg imgs*/
/*background-image: url(https://picsum.photos/800/200) , url(https://picsum.photos/500/500) ,url(https://picsum.photos/200/500) ;*/
/*repeat |no-repeat | repeat-x | repeat-y | space | round*/
/*background-repeat:no-repeat , no-repeat ,no-repeat;*/
/* combination krna hai => left right center top bottom
also used px , %
*/
/*background-position:center bottom , right bottom , left bottom;*/
/*shorthand properties ???????*/
/*
background: url(https://picsum.photos/800/200) no-repeat center center ,
url(https://picsum.photos/200/500) no-repeat center left,
url(https://picsum.photos/100/200) no-repeat right center;
*/
/*
background-image: url(https://picsum.photos/1000/800);
background-repeat: no-repeat;
background-position: left center;*/
background-color: red;
/* to fix the image
scroll
*/
/*background-attachment: fixed;*/
margin: 0;
/*bg img size defined
auto.
w450px h500px;
50% 20%
cover - all area
contain - not cover alll but adjust img ke hisab se.
*/
background-size:100%;
/* used for bg img / bg img start kaha se hori hai ?*/
/*background-origin: border-box;*/
/*background-origin: content-box;*/
/*background-origin: padding-box;*/
/* basically used for bg color*/
background-clip: content-box;
}
</style>
</head>
<body>
<div class="box">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Vel, vitae doloremque voluptates quae architecto perspiciatis ad earum inventore nulla labore veritatis natus totam odit distinctio iusto quidem impedit, similique amet quas. Corrupti quos fugit reprehenderit, dolorem ab sit amet delectus, illo omnis, laudantium dicta accusantium itaque unde debitis magni. Saepe atque dicta laudantium mollitia eligendi, voluptatem laboriosam rem nam ipsam dolores quidem est, autem? Amet vitae, et velit repellat consequatur accusantium nam nisi vel repellendus possimus quas cum atque porro quidem molestiae debitis eos illum quod delectus veniam nobis accusamus beatae laudantium ratione illo? Illum aut non suscipit, deleniti itaque voluptate optio qui, reiciendis ab facilis in amet magni esse quis explicabo aliquid doloremque fugiat necessitatibus quae dignissimos veniam, laudantium? Quisquam officiis dolor animi repellat sed distinctio eligendi porro cupiditate aliquam alias officia corrupti tenetur, expedita. Molestias laboriosam accusantium cumque labore officia doloremque ex minus recusandae quod, ipsa dolor tenetur ratione repellendus rem quam consequuntur ab architecto id reiciendis asperiores dicta odio distinctio! In at delectus quibusdam obcaecati, ipsum assumenda similique commodi maiores corrupti id aperiam rem officia animi quam impedit culpa. Eius suscipit adipisci iusto doloribus eaque beatae eum. Officiis repellat nostrum soluta nisi veritatis blanditiis excepturi reiciendis, quaerat, itaque sit? Commodi, nesciunt, eveniet. Dolorem, nulla sit quidem, recusandae error mollitia iusto ab magni deserunt quas quo consectetur, tempore aliquam cupiditate similique, dolorum at ea ad nobis pariatur? Impedit reprehenderit porro eius eaque autem atque sunt. Qui quibusdam reiciendis magnam explicabo eaque, ab omnis placeat fuga rem blanditiis sequi quisquam alias facilis maxime. Dignissimos architecto nihil, iste voluptatem, rerum mollitia. Praesentium nisi rem ducimus, necessitatibus accusantium enim velit deserunt ipsa? Consectetur, dolorem pariatur molestiae. Repellat facere, ipsum nesciunt sit dignissimos laboriosam cum ullam iure in iusto esse similique totam reiciendis dolorem fugiat eum praesentium magnam vel, magni obcaecati tempora officia ratione vitae mollitia beatae? Repellendus voluptatibus quas quod tenetur similique, ut itaque, illum laboriosam incidunt architecto accusamus, consequuntur ducimus. Consectetur iure quaerat praesentium quam distinctio magni accusamus laudantium voluptate sequi eos similique tenetur quo adipisci, eaque iste dicta nisi beatae odio vitae asperiores maiores corporis ad animi. Impedit repellat vel voluptatum tempora amet ea perferendis quos veniam aut, quas, id illum veritatis mollitia pariatur similique, dolores perspiciatis. Maiores veniam molestias dicta quis tempora iure optio consequuntur, enim quia fugiat nemo necessitatibus, natus quod id, sit rerum facilis quasi odio sunt nostrum error! Quam suscipit quia nobis numquam distinctio laborum ut. Consectetur reiciendis ipsa qui iusto sapiente eos temporibus ut veniam fuga in. Voluptatum, temporibus et. Reprehenderit omnis illo dignissimos iure quasi, beatae eius unde labore ut vero excepturi nam laboriosam, et exercitationem iusto ea, numquam deleniti quas temporibus repellendus possimus? Animi voluptatum soluta quo minima deserunt eos quibusdam itaque nostrum consequuntur odit, id aspernatur explicabo, dolor, quis, laboriosam repudiandae incidunt. Placeat aut neque, aliquid tempora dolore quo sint numquam ex sit maxime eos quae dignissimos voluptatibus officiis voluptas molestias culpa magnam pariatur, quod quibusdam aspernatur quidem modi. Sed laborum asperiores magnam reiciendis nostrum est nisi mollitia dolores voluptatum aspernatur!
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Veniam, quisquam pariatur voluptas iste id, nemo debitis commodi ducimus maxime distinctio maiores corrupti nesciunt ad, at nisi mollitia saepe amet impedit sed ratione. Voluptatum sit, consequatur enim in non harum. Error perspiciatis provident, laudantium impedit totam officiis facilis harum enim exercitationem et repellendus culpa obcaecati iusto saepe ratione nesciunt repellat esse nihil sit, delectus est aspernatur! Dignissimos cum, eum suscipit distinctio doloremque quibusdam. Veritatis sequi cupiditate, aliquid alias similique quibusdam officiis eveniet reiciendis, laudantium velit ab. Corrupti reprehenderit in fuga, similique ipsum id labore laudantium autem adipisci doloremque et quos, repellendus deleniti obcaecati tempore aliquid iste quo dicta a quas, accusamus. Ratione voluptatem reiciendis repudiandae illum recusandae illo perferendis molestias iure quidem maiores. Praesentium ipsum ipsam vitae, asperiores dolore veniam consequatur veritatis incidunt tenetur voluptates suscipit, iure iusto, deleniti beatae, eius itaque magnam sit corporis. Asperiores voluptas repellendus id nostrum ad doloribus nobis perferendis consequuntur illo quam recusandae voluptatum non qui natus sunt maiores dolorum harum aspernatur error possimus dolorem alias, magnam repellat obcaecati ab? Amet, exercitationem officia voluptates quo ratione magnam natus laudantium, placeat maiores illo dolor aspernatur. A, labore. Commodi illum, aliquid itaque exercitationem vitae blanditiis et dolor ad perferendis esse praesentium atque quisquam beatae quod dolorem sed alias adipisci pariatur recusandae illo temporibus enim maiores nisi. Voluptatem asperiores, itaque totam necessitatibus tempore excepturi, rem nihil, voluptate laboriosam quisquam earum? Corrupti nam modi, repudiandae assumenda, neque impedit, ipsum error eius dolorem voluptate ut similique cumque provident sed. Necessitatibus non officiis velit doloremque, enim ullam debitis molestiae beatae animi itaque excepturi eos praesentium odio libero explicabo? Minima repellendus, at iusto, ea rerum illo sequi iste cupiditate in voluptates, architecto, possimus. Error vitae vero totam perferendis at. Blanditiis, voluptas voluptatibus at quam, molestiae vel dolores earum quisquam culpa optio labore iusto ea! Distinctio nam quasi architecto suscipit eum porro alias esse praesentium amet eligendi exercitationem, tempora obcaecati dolorum id magnam quae? Dolor, architecto error velit? Veritatis, cumque harum pariatur, quisquam eum quos quaerat molestias explicabo molestiae illum amet voluptatem culpa reiciendis accusantium quidem sint ut natus enim nisi. At fuga quibusdam rerum necessitatibus quia, reprehenderit, exercitationem qui itaque consectetur hic quaerat vitae distinctio officiis est nisi dolorem soluta dignissimos, nemo, magni. Tempore mollitia accusantium quidem delectus, hic soluta cupiditate tempora porro dolore, molestiae, magni quisquam enim dolores cum, exercitationem! Sequi debitis amet alias numquam illum aliquam, harum dolor culpa eveniet rerum veritatis impedit, veniam beatae incidunt quia atque doloribus possimus, itaque iste facere libero. Cumque iure laudantium, veniam atque, architecto quae fugit temporibus provident quis amet sit magnam possimus quod reprehenderit et. Laborum corporis, eos vitae suscipit dolor? Optio molestias recusandae hic sapiente quis iure velit excepturi maiores corrupti totam dignissimos, expedita pariatur explicabo aspernatur ducimus id a reprehenderit quae consequuntur soluta commodi debitis? Debitis assumenda praesentium rerum id vero nemo hic illo, quia sapiente repudiandae officiis pariatur officia dolor provident eos alias ipsum deserunt repellendus, vitae labore, perferendis sit. Itaque pariatur ratione alias aliquam labore quia mollitia iusto soluta, nemo veritatis. Sit rem aliquid dolor sint nostrum recusandae. Excepturi, aperiam, quo. Excepturi ea repudiandae fugiat nam qui ipsa ad labore commodi ab dolor officiis ex doloribus, consequatur at asperiores alias incidunt voluptatum sed eveniet enim voluptates nemo officia quas beatae quaerat. Dolorum porro maiores libero tempore iure nostrum eum, debitis, perferendis quo molestiae dolor, ex quas dignissimos animi est. Quas, quod explicabo rerum pariatur fugit placeat tempora voluptate, asperiores cum vitae itaque eius labore non eos quo, ipsam ullam, quam amet mollitia maxime aliquam beatae? Animi atque ab quis corrupti, doloremque modi illo impedit aut porro voluptatibus magni totam autem! Odio obcaecati, temporibus saepe consectetur eveniet unde iste quae minima similique voluptate sunt voluptatem ut reiciendis mollitia cumque deleniti et iure, repellendus quibusdam dicta id, provident eaque praesentium, inventore adipisci. At, ut. Iusto neque possimus quasi officia in voluptate quibusdam debitis quae, harum, eius aperiam atque, porro fuga rem autem, amet quis. Pariatur iusto fuga quas impedit explicabo consectetur est incidunt non recusandae doloremque enim laborum, ratione aut exercitationem perferendis odit, tenetur corporis. Recusandae ratione porro nam ab dolorem tenetur, tempora laborum sint quidem! Obcaecati culpa distinctio reprehenderit iste, amet ullam unde velit impedit, quas ipsam, vitae molestiae vero tenetur blanditiis doloribus cupiditate ipsa in, facilis error voluptatum? Voluptatum quis doloremque praesentium cupiditate aperiam! Veritatis dignissimos, perferendis minus. Dicta quis totam incidunt numquam voluptates cum. Mollitia deleniti, soluta eos aliquid dicta vitae, suscipit ducimus exercitationem similique repudiandae laborum autem? Ullam quos aperiam est sequi? Rem odio sapiente eligendi sed ipsam delectus rerum est doloribus dolore! Expedita autem illo placeat voluptatum eum officia blanditiis! Similique, quam alias fugiat, neque deleniti necessitatibus ab aspernatur, repellat eaque in iste. Adipisci, quod, suscipit. Corporis, temporibus aspernatur quisquam dolorem ducimus pariatur unde fugit tempora? Harum, eos voluptates sunt sapiente nihil a rerum quibusdam laborum amet excepturi nulla incidunt, alias neque quas ad facere sit id beatae iste sint obcaecati minima enim? Eum quaerat aperiam laboriosam quidem exercitationem dolorem magnam nisi voluptatum? Dolorum neque libero, commodi voluptatem expedita provident qui laboriosam unde. Minus dolore, optio consequatur! Nesciunt minus quae natus quasi exercitationem? Tenetur, numquam beatae facere, officiis aspernatur vitae corrupti, quibusdam aliquid sed molestiae dolores itaque! Nulla reprehenderit sint necessitatibus eveniet numquam pariatur quas ipsam vero, temporibus sapiente autem impedit beatae, voluptas commodi blanditiis assumenda soluta. Voluptate molestiae odio, incidunt corporis consequatur facere officia vel esse natus, mollitia unde alias sit laborum minus fugiat vitae voluptatum assumenda velit, nisi officiis amet. Mollitia, ipsum beatae incidunt quos accusantium? Illo, impedit, adipisci. Delectus, modi, aliquid! Vero deleniti similique deserunt, earum quas tenetur recusandae labore cupiditate est delectus et magni perferendis officiis eveniet. Iure deserunt adipisci voluptatem ullam molestias doloribus nulla, atque similique quidem modi dolores hic aliquid repellat perspiciatis. Minima iste vel mollitia accusamus unde hic, quasi laborum ullam in, repellat saepe ducimus quidem voluptas quis similique veritatis, beatae, accusantium voluptates inventore nostrum impedit! Consequatur non pariatur, ad placeat reiciendis quod rerum, eos necessitatibus, ex dolore quisquam earum cum sequi iusto sit expedita, nemo voluptatibus blanditiis repellat. Reprehenderit!
Lorem ipsum, dolor sit amet consectetur, adipisicing elit. Mollitia voluptatum magni ducimus blanditiis corrupti molestias quae repellendus dolorum sapiente? Ipsum cupiditate, fugiat voluptatibus necessitatibus, exercitationem perferendis aliquid, aut, officiis ut similique cumque et dolorem alias deleniti quibusdam eaque reprehenderit atque. Laudantium aut necessitatibus architecto expedita voluptas. Voluptates eaque excepturi corporis consequuntur voluptas eligendi molestiae repellat ratione omnis itaque neque et ea dolore inventore minima atque necessitatibus nam iure, architecto sequi nesciunt sed esse possimus! Voluptatem, fugiat nulla excepturi itaque velit eum libero a quo ipsam in fuga dolores est, natus omnis laborum cumque eius quaerat facere. Iste, nam quae esse cupiditate velit, architecto est animi ipsum mollitia laborum veniam sed quasi veritatis eius, placeat quibusdam molestias debitis laudantium deleniti enim? Eaque repellat cum blanditiis itaque dolorem illum cupiditate harum quo velit ad temporibus praesentium, quia optio doloribus, sequi rerum nemo enim? Rerum quasi velit consequuntur eius deserunt, sapiente minima nulla maiores culpa vel deleniti eligendi illo fuga quae perferendis obcaecati, quos exercitationem reiciendis! Doloremque vitae accusantium quibusdam tempora assumenda illum dolores tenetur reprehenderit dolore velit aliquam est voluptates, commodi incidunt eum consequuntur eveniet itaque, cum dolorem, odit, eius molestias. Exercitationem ea adipisci repellat, aspernatur sit repudiandae deserunt deleniti fugiat impedit maiores numquam dolorem voluptates quos totam quidem voluptate sunt officia rem laborum, sequi at culpa, dolor. Iure consequuntur fuga odio iste voluptas ex voluptate assumenda numquam, magnam possimus, reiciendis harum quae quod maxime quasi facere ducimus culpa voluptatibus velit delectus et maiores aut, itaque laudantium. Dolorem beatae, nemo, voluptas officiis neque corrupti omnis nostrum eveniet sed enim commodi eaque cumque facilis sit aliquid? Quam praesentium beatae aliquid magni placeat voluptate quos esse iste inventore deleniti, dignissimos accusantium necessitatibus eius asperiores optio reiciendis atque amet at itaque doloremque earum. Consequuntur ea deserunt aliquam repudiandae veritatis voluptas possimus voluptatum totam necessitatibus beatae eum debitis explicabo perspiciatis nisi vero ab eius, porro! Fugit similique magnam iusto soluta ipsum maxime quo, temporibus perferendis est qui rerum voluptatem harum itaque exercitationem, optio eos, ratione possimus recusandae quibusdam aliquid nemo? Voluptas fuga porro amet atque quia tempora alias veniam asperiores delectus voluptatem error quos dolorum voluptatibus vero cum quae quasi odit temporibus iste magnam adipisci, minus. Eius alias sunt ratione, harum! Provident, aliquid, molestias? Laborum corrupti, velit iure distinctio, ullam temporibus reprehenderit. Assumenda labore suscipit vitae obcaecati voluptate minima quis quae ipsum, qui in expedita dolor sapiente voluptas quod, culpa distinctio, quibusdam natus saepe maiores repellat odit modi dolorum exercitationem doloribus. Accusantium, architecto laudantium illum itaque animi, cupiditate dignissimos hic odit in, impedit autem atque necessitatibus molestias inventore quam tenetur. Perferendis corrupti esse numquam quaerat eos repellat laudantium adipisci expedita minima quasi atque, suscipit ipsum mollitia beatae quidem, reiciendis nobis quam officia rerum voluptas nemo quo vel, et. Voluptate eveniet fugit animi? Unde est voluptatibus sint atque nostrum quos corrupti, cupiditate, consectetur doloremque harum. Sed corrupti quidem dolore deleniti, blanditiis eveniet, sunt dicta tempore fuga sit id odit fugiat culpa consequatur a necessitatibus? Iusto eum corporis enim molestiae provident numquam similique debitis voluptate adipisci quibusdam eius sint saepe ipsum quia quisquam, exercitationem fuga. Obcaecati, nostrum. Totam, reiciendis magnam corrupti amet voluptatibus rerum ipsum a dicta officiis cumque eaque eligendi consectetur exercitationem vero, repellat omnis maiores. Esse incidunt cum laborum dicta mollitia at nulla ea nostrum facere, modi autem fugiat illum, sint veniam. Omnis nulla sunt voluptatibus repellat totam alias ut, rerum accusantium nemo esse architecto possimus animi ipsum impedit? Recusandae in commodi quam veniam alias, ipsum obcaecati cum, earum sapiente autem culpa, rem omnis laboriosam magnam. Maiores iure voluptatem minima iste expedita, repudiandae qui temporibus, suscipit exercitationem non architecto, debitis atque illum illo molestiae accusantium voluptatum deleniti. Totam iure, id harum expedita, aliquid, natus reprehenderit cumque explicabo dignissimos facere libero ratione. Animi cumque ipsam facere necessitatibus dolorem vitae itaque provident odit sequi repellendus, ratione laudantium neque perspiciatis consectetur atque rerum consequuntur asperiores odio cupiditate nisi aspernatur ea mollitia! Recusandae facere saepe, ipsa ipsum et quisquam veritatis reiciendis. Quia enim soluta aliquam ducimus et quod qui earum cupiditate quam ipsum. Maxime aperiam quos repellat, ab harum et sapiente amet sequi illum nobis sit, ut labore quod similique nisi, aut quasi maiores? Aliquam laudantium optio hic temporibus dolorem. Culpa reiciendis ea reprehenderit eligendi deleniti quo eveniet voluptas magni architecto tempore itaque maiores fugit repellendus totam, perspiciatis quisquam animi voluptatibus possimus laboriosam enim necessitatibus. Repellat mollitia impedit accusamus quo autem, consequuntur voluptatem, illo consequatur vero debitis libero! Id a, labore explicabo, molestiae amet eos! Quos nisi animi dicta, nostrum nesciunt nobis perferendis vitae quia doloremque iusto dignissimos blanditiis vero quidem maiores reprehenderit asperiores ex aut quibusdam veniam error. Blanditiis repudiandae eos temporibus quis harum exercitationem voluptatum, odio molestias! Pariatur dignissimos itaque, veritatis assumenda necessitatibus optio delectus dolorum repudiandae quod a, libero aut eaque? Doloremque repellendus, ducimus sint tenetur neque obcaecati porro aperiam! Incidunt odit hic, asperiores soluta tenetur esse temporibus minima quia aut rem, qui illum, voluptates consequuntur ad consectetur earum a ipsum blanditiis nostrum neque voluptate explicabo error velit cum. Cumque, nulla rem animi quos consequuntur repellendus reprehenderit quia recusandae error repudiandae debitis quae magni beatae qui quis autem. Laborum voluptates, dolore minus ab veritatis aliquam autem cumque ut perspiciatis hic id qui. Tempore libero et nesciunt dicta blanditiis eaque incidunt animi dolorem debitis, deleniti voluptatibus ipsa praesentium repudiandae expedita magni suscipit non inventore pariatur quia quisquam facilis distinctio consequuntur maiores aliquam voluptates. Cupiditate sequi voluptatem alias? Quos vero, iusto tempore cumque rerum adipisci culpa obcaecati, magnam voluptatem. Unde, id, numquam aliquam ut perspiciatis aspernatur quisquam impedit ducimus quam, odio eaque earum, tempore nisi voluptate nihil. Quaerat eos maiores, dignissimos enim, qui officiis, dolor reiciendis nesciunt blanditiis provident, dolores repudiandae tempore. Velit dignissimos incidunt odio ducimus ad et harum iusto placeat temporibus unde, inventore numquam laboriosam quos fugiat enim maxime non cupiditate aut minima minus error. Explicabo veritatis possimus quasi, earum molestiae fuga blanditiis, magnam consectetur quam at perferendis. Quibusdam maxime aspernatur corrupti omnis, facilis veritatis porro, assumenda cupiditate nobis blanditiis cum, officia enim ut vitae deserunt? Quo, possimus. Totam, rem vero porro consequatur minus? Iusto, velit, est?
</div>
</body>
</html>