Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> CSS

3D एलिमेंट्स के व्यू पर्सपेक्टिव को कैसे निर्दिष्ट करें


3D एलिमेंट्स को कैसे देखा जाता है, इसका पर्सपेक्टिव निर्दिष्ट करने के लिए CSS perspective प्रॉपर्टी का उपयोग करें।

इसे प्राप्त करने के लिए निम्न कोड चलाकर देखें:

उदाहरण

<!DOCTYPE html> <html>    <head>       <style>          .demo1 {             position: relative;             width: 150px;             height: 150px;             background-color: yellow;             perspective: 80px;             margin: 50px;          }          .demo2 {             position: absolute;             padding: 20px;             background-color: orange;             transform-style: preserve-3d;             transform: rotateX(45deg);          }        </style>    </head>    <body>       <h1>Rotation</h1>       <div class = "demo1">Demo          <div class = "demo2">Demo          </div>       </div>    </body> </html>

  1. CSS से एलिमेंट्स को ब्राउज़र विंडो की पूरी ऊंचाई तक कैसे स्ट्रेच करें? CSS से एलिमेंट्स को ब्राउज़र विंडो की पूरी ऊंचाई तक कैसे स्ट्रेच करें?

    CSS से एलिमेंट्स को ब्राउज़र विंडो की पूरी ऊंचाई तक स्ट्रेच करने के लिए, कोड निम्नानुसार है -उदाहरण<!DOCTYPE html> <html> <head> <title>Page Title</title> <style>    *{       box-sizing: border-box;    }    html, body {

  1. HTML में <span> टैग से एलिमेंट्स कैसे स्टाइल करें? HTML में <span> टैग से एलिमेंट्स कैसे स्टाइल करें?

    इंलाइन एलिमेंट्स के लिए <span> <span> टैग इंलाइन एलिमेंट्स को ग्रुप करके स्टाइल लागू करने के लिए उपयोग होता है। यह ब्लॉक-लेवल नहीं, केवल इंलाइन कंटेंट के लिए है। उदाहरण <!DOCTYPE html> <html> <head> <title>HTML span Tag</title> </head> <body&g

  1. HTML में <div> टैग से एलिमेंट्स कैसे स्टाइल करें? HTML में <div> टैग से एलिमेंट्स कैसे स्टाइल करें?

    ब्लॉक-लेवल सेक्शन के लिए <div> <div> टैग HTML डॉक्यूमेंट का एक सेक्शन डिफाइन करता है। बड़े ब्लॉक-लेवल एलिमेंट्स को ग्रुप करके एक साथ फॉर्मेट करने के लिए उपयोगी है। उदाहरण: ID सेलेक्टर के साथ <!DOCTYPE html> <html> <head> <title>HTML div Tag</title>