सीएसएस परिप्रेक्ष्य संपत्ति
उदाहरण
3D-स्थित तत्व को कुछ परिप्रेक्ष्य दें:
#div1
{
perspective: 100px;
}
नीचे और अधिक "इसे स्वयं आज़माएं" उदाहरण।
परिभाषा और उपयोग
संपत्ति का perspective
उपयोग 3D-स्थित तत्व को कुछ परिप्रेक्ष्य देने के लिए किया जाता है।
संपत्ति परिभाषित करती है कि perspective
वस्तु उपयोगकर्ता से कितनी दूर है। इसलिए, कम मान के परिणामस्वरूप उच्च मान की तुलना में अधिक गहन 3D प्रभाव होगा।
किसी तत्व के लिए संपत्ति को परिभाषित करते समय perspective
, यह CHILD तत्व हैं जो परिप्रेक्ष्य दृश्य प्राप्त करते हैं, न कि स्वयं तत्व।
युक्ति: परिप्रेक्ष्य-मूल गुण को भी देखें , जो परिभाषित करता है कि उपयोगकर्ता किस स्थिति में 3D ऑब्जेक्ट को देख रहा है।
परिप्रेक्ष्य संपत्ति को बेहतर ढंग से समझने के लिए, एक डेमो देखें ।
डिफ़ॉल्ट मान: | कोई नहीं |
---|---|
विरासत में मिला: | नहीं |
एनिमेटेबल: | हां। एनिमेटेबल के बारे में पढ़ें |
संस्करण: | CSS3 |
जावास्क्रिप्ट सिंटैक्स: | ऑब्जेक्ट .style.perspective="50px" |
ब्राउज़र समर्थन
तालिका में संख्याएं पहले ब्राउज़र संस्करण को निर्दिष्ट करती हैं जो पूरी तरह से संपत्ति का समर्थन करता है।
-वेबकिट- या -मोज़ के बाद की संख्याएं- पहले संस्करण को निर्दिष्ट करें जो उपसर्ग के साथ काम करता है।
Property | |||||
---|---|---|---|---|---|
perspective | 36.0 12.0 -webkit- |
10.0 | 16.0 10.0 -moz- |
9.0 4.0.3 -webkit- |
23.0 15.0 -webkit- |
सीएसएस सिंटेक्स
perspective: length|none;
सम्पत्ति की कीमत
Property Value | Description |
---|---|
length | How far the element is placed from the view |
none | Default value. Same as 0. The perspective is not set |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
और ज्यादा उदाहरण
उदाहरण
एक क्यूब बनाएं और अलग-अलग दृष्टिकोण सेट करें:
.ex1 {
perspective: 800px;
}
.ex2 {
perspective: 150px;
}
संबंधित पृष्ठ
CSS ट्यूटोरियल: CSS 3D Transforms
एचटीएमएल डोम संदर्भ: परिप्रेक्ष्य संपत्ति