How to make Text Image using Html and CSS - Learn Program

How to make Text Image using Html and CSS - Learn Program

 Text Image



You can just create amazing text photo using html and css. 

View code:  Text image code

Html code 

<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Libero cupiditate, explicabo et dolores id ullam quod deserunt animi iste magnam perferendis sequi dolore nisi asperiores saepe quae fugiat voluptatibus. Expedita aut exercitationem dignissimos ut. Numquam consectetur tempore nesciunt expedita doloremque similique quam eveniet amet fuga maiores, ex exercitationem quae eaque deserunt quas sit vero! Id repellat deleniti eum quidem veniam nisi placeat debitis eligendi consequuntur nam aperiam alias voluptatibus non repellendus expedita accusantium eaque numquam rem, ipsam dolorem. Aliquam placeat odit sit possimus culpa nesciunt natus voluptate at iure ad harum, magnam asperiores obcaecati earum. Sapiente obcaecati vero sequi distinctio possimus a rem, laboriosam veniam, ut deserunt at aliquid totam suscipit debitis quod laudantium ab, expedita consectetur voluptate hic enim quos cumque quasi? Temporibus, sit. Qui voluptas temporibus quis perspiciatis ullam numquam nobis architecto voluptate aut quisquam nemo maxime quo accusantium adipisci rem dignissimos ipsam aperiam magni expedita ratione hic, a distinctio natus quasi. Explicabo perspiciatis dolores obcaecati repudiandae ipsum sit, rerum aut, ea consequatur quod, adipisci fuga iusto illum deleniti accusamus reprehenderit quam libero dicta quasi aliquid dolorem! Qui iusto, libero quaerat iure accusantium deserunt ratione temporibus dolorem ullam vel. Aliquid nihil dolorem quo eum ipsum iure sint velit tenetur at, nisi voluptatum iste omnis dolor sit expedita sunt, modi asperiores a architecto ea eius nulla. Iste voluptates dolorum asperiores harum quaerat explicabo? Adipisci, in nisi eos repudiandae sit nam dolor quidem ullam accusamus sapiente vero magni, fuga optio ipsam voluptatibus, quos nihil sed molestiae laboriosam praesentium soluta aliquam a aut? Officia, necessitatibus libero voluptatibus id nostrum rem numquam laborum saepe possimus voluptates cupiditate magnam est illum veniam non maxime error quaerat quos aperiam! Dicta est modi alias quisquam, soluta reiciendis consequatur accusantium aliquid esse ratione ut explicabo necessitatibus molestiae repellendus placeat omnis iste earum iure vel, asperiores id molestias! Architecto sed veritatis quae ipsam magnam omnis, temporibus quibusdam veniam facere mollitia? Possimus, ea hic quaerat repellendus aliquam nobis dignissimos eveniet molestias. Qui repudiandae quam ut inventore, delectus, porro ad quisquam dolorem reprehenderit nemo animi laborum, doloribus quas enim in adipisci nostrum temporibus. Rerum illo inventore, eligendi laudantium maxime itaque aspernatur maiores ratione consequuntur. Labore quasi ducimus repellendus, nisi fugit praesentium perferendis at commodi. Doloribus ab ducimus odit debitis non perspiciatis, praesentium quae eius, eligendi beatae delectus vitae rem dolorum iusto quia vero atque neque repudiandae, molestias fugiat cupiditate error suscipit. Qui voluptatibus quae nobis, quidem suscipit fuga sapiente dolore aut. Accusantium saepe consequuntur, sed fugiat consequatur quis et repellat provident explicabo. Laudantium quam alias, veritatis cumque corporis autem nulla quas illum aspernatur maxime officiis, mollitia illo voluptatem adipisci expedita dolore harum asperiores deserunt eius, sint assumenda. Quis deserunt est error? Aliquid, ipsam voluptate repellat rem iste aut accusamus officiis harum quae recusandae? Corporis tempore unde ea tempora eveniet soluta quas aliquid officia perferendis corrupti autem, dignissimos debitis ratione repellat aut quos rem sit aperiam aspernatur nostrum sint voluptas dicta quia modi. Accusamus laudantium architecto ex dolorum earum eos alias voluptate quasi repellat nesciunt veritatis officia odit adipisci a tempore obcaecati id, dolorem sed modi deleniti, sequi commodi qui? Neque molestias vero quod, quisquam voluptate nemo doloribus quidem cupiditate qui minima quasi atque adipisci soluta reiciendis sequi molestiae, quae nesciunt tempora itaque impedit. Suscipit quisquam, aliquam distinctio deserunt repudiandae animi omnis non dolores quos maiores quasi labore nemo iusto veritatis, debitis rem nostrum! Omnis impedit excepturi sit quibusdam, accusantium quo tenetur cumque nam reprehenderit veniam delectus illo consequuntur, sunt perferendis fugiat tempora praesentium minima velit mollitia dolor esse enim sapiente! Rem expedita perspiciatis voluptas. Assumenda, quisquam. Porro vero dicta, quia laboriosam quaerat mollitia obcaecati est odio neque autem nostrum esse sequi, cumque quidem debitis ratione nulla totam reprehenderit! Alias odit vero sequi animi error, repellendus at eos dignissimos nihil, ab repudiandae architecto labore harum illum earum odio quisquam dolorum mollitia eum voluptas officia quia veritatis voluptates corrupti. Consequatur ipsum nemo saepe eveniet magni laboriosam. Culpa rerum dolor minima natus nostrum obcaecati dicta? Deleniti molestiae quasi aspernatur numquam, quidem id, necessitatibus officia obcaecati laudantium dignissimos quo voluptate eum consequatur eligendi, eveniet odio ab. Corrupti, maiores earum quasi aspernatur repudiandae molestiae veniam veritatis quos quis corporis ea labore exercitationem nisi, est cum aperiam a. Nulla laudantium consequatur quis corrupti illum facilis iure quod labore temporibus similique culpa repellat eum rem voluptatem delectus cupiditate ipsa recusandae fuga ex, placeat aut, ad sint soluta animi. Praesentium fuga voluptate maiores molestiae alias beatae dolores placeat consequuntur quis voluptates rem cupiditate, ut corporis ab. Officia a natus sequi enim totam! Inventore corporis omnis maxime eligendi, vel hic quisquam pariatur dolore obcaecati labore fugit odit voluptates quis minima magni nam tenetur, sapiente quod. Quas sit unde, perferendis pariatur dolor saepe libero neque quidem cupiditate facilis esse fuga mollitia dolores explicabo sequi aliquid necessitatibus odit animi minima. Veritatis reiciendis rem, doloribus laboriosam qui nisi dolorem sint blanditiis quis error temporibus, dolores sed, sequi quas explicabo id? Similique odit minima unde nobis a debitis beatae asperiores impedit, deserunt eius provident accusantium amet! Numquam id, reiciendis ipsum placeat est omnis optio ullam quae ut qui libero cum! Quia veniam corporis quis praesentium quod debitis velit repellat asperiores, nemo error? Voluptas similique laborum eum minus officia ipsa eveniet, corporis harum dignissimos veritatis dicta at, doloremque, neque eos doloribus repellat consequatur inventore aspernatur quisquam vitae nisi! Rerum, blanditiis amet quisquam qui cum minima inventore maxime possimus quia accusamus consequuntur animi nulla eius fugiat tenetur! Sed quae explicabo eos placeat doloribus inventore debitis dolores fuga atque deleniti quo doloremque eius vitae nemo iusto in, quod error. Asperiores, tempora voluptates? Debitis, beatae officiis. Maxime fugiat iste doloribus harum. Nihil nemo ea sit fugiat blanditiis quidem aut numquam exercitationem pariatur eum dolore molestiae ipsam accusantium laborum expedita nostrum, earum modi dicta minus qui. Quo, natus, eligendi ratione hic obcaecati delectus similique temporibus illo accusantium pariatur earum doloribus corporis deserunt ex consectetur magnam facilis exercitationem porro labore sed maxime explicabo non! Quidem dolore iure eum illo vero rem autem esse qui? Tenetur sint, dolor aperiam quasi architecto asperiores cum, ab quae eius tempora ratione praesentium aut iste. Ad quo beatae reprehenderit reiciendis ex, doloribus alias repellendus adipisci quisquam est cumque dicta animi. Accusamus quis temporibus asperiores quos facere expedita voluptatum culpa nisi omnis nesciunt, dicta architecto id modi explicabo repellat sit nobis, iusto, minima laudantium? Exercitationem odio est at iste possimus minus ipsam inventore fuga, omnis voluptas nostrum earum reiciendis ipsum perferendis distinctio adipisci sint expedita aliquam nesciunt officia. Incidunt, magni tenetur alias ab tempore pariatur optio error repellat! Eum vero nam error eius quia sint dolorem dolores ex iste cumque saepe dolorum rem nesciunt laboriosam, atque beatae assumenda consequatur, corporis blanditiis cupiditate quam quasi veritatis? Harum aperiam dignissimos tenetur modi. Eligendi, deserunt alias? Eveniet nobis cupiditate laborum sequi rem dolores maiores, ducimus praesentium illo ratione tempora corrupti sint, recusandae laboriosam accusantium, ad sed eum? Eos, officia, voluptas iste sint blanditiis tenetur repellendus ipsum reiciendis eius nemo, natus nesciunt earum labore? Quia, eaque. Beatae impedit eaque dolorem rem porro vero quisquam deserunt officiis, quis labore minima culpa reiciendis, laboriosam fuga reprehenderit similique facere aperiam neque sint nam nihil totam ut. Qui animi necessitatibus at dolor, id harum obcaecati ipsum numquam eos, quod eum, adipisci omnis tenetur assumenda dicta perspiciatis. Sed provident similique nisi dolor beatae!
</p>

CSS code 

body {
  background: black;
  overflow: hidden;
}

p {
  background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6LnF7RE21hwmTaHRS8wOXmgfiZnPqQRNC9wmZMWMCyoC2r3N49KShyBU9kn7fmw4kQrag4lSsSaAsF2v068h6wm9l9OxhSUGheyRccMIkvzfWEjDGGleCuzRm58blGx8yBCzWHw2tjPYQ/s1600/cute-babies-dp-for-whatsapp+%252812%2529.jpg");
  background-size: 500px;
  background-repeat: no-repeat;
  font-family: sans-serif;
  line-height: 12px;
  background-attachment: fixed;
  -webkit-background-clip: text;
  -webkit-text-fill-color: rgba(255, 255, 255, 0);
}

Output : 



Post a Comment

Previous Post Next Post