ओवरफ्लो प्रॉपर्टी ने CSS3 3 डी ट्रांसफॉर्म क्यों तोड़ दिया? - सीएसएस, सीएसएस 3, ट्रांसफॉर्म, सीएसएस-ट्रांसफॉर्म

मैं कई नेस्टेड 3 डी रूपांतरित तत्वों को बनाने की कोशिश कर रहा हूं। आईई। कई नेस्टेड तत्वों में सभी 3 डी परिवर्तन होते हैं और transform-style:preserve-3d संपत्ति।

हालांकि, जब एक तत्व में एक है overflow संपत्ति, इसके सभी पूर्वजों को चपटा हुआ है।

उदाहरण के लिए:

<style>
div{transform-style:preserve-3d;}
</style>

<div style="transform:rotateY(30deg) rotateX(-30deg);">
<div style="transform:translateZ(30px)">
<div style="transform:translateZ(30px)">
<div style="transform:translateZ(30px);overflow:hidden"><!-- everything beyond here is flat -->
<div style="transform:translateZ(30px)">
<div style="transform:translateZ(30px)">
<div style="transform:translateZ(30px)">
</div>
</div>
</div>
</div>
</div>
</div>
</div>

बेला: http://jsfiddle.net/Lqfy3mgs/

मैंने क्रोम और एफएफ में इसका परीक्षण किया। क्या पूर्वजों के साथ भी पूर्वजों को 3 डी बनाना संभव है overflow?

उत्तर:

उत्तर № 1 के लिए 6

मुझे डर है कि "प्रति spec:

निम्नलिखित सीएसएस संपत्ति मानों को उपयोगकर्ता एजेंट को बनाने की आवश्यकता होती है वे पहले से ही वंशज तत्वों का प्रतिनिधित्व किया जा सकता है लागू, और इसलिए ट्रांसफॉर्म-शैली के उपयोग किए गए मान को बल दें समतल:

  • अतिप्रवाह: दृश्यमान के अलावा कोई भी मूल्य।
  • ...

स्रोत: http://dev.w3.org/csswg/css-transforms/#grouping-property-values


जवाब के लिए 0 № 2

w3:

छिपा हुआ यह मान इंगित करता है कि सामग्री को फिसल गया है और क्लिपिंग क्षेत्र के बाहर सामग्री को देखने के लिए कोई स्क्रॉलिंग उपयोगकर्ता इंटरफ़ेस प्रदान नहीं किया जाना चाहिए।

जैसा कि आप देख सकते हैं कि यह 3 डी रूपांतरित तत्वों के लिए है, इसलिए ट्रांसफॉर्म क्लिपिंग से बच नहीं सकता है जो सेटिंग करते समय खुश होता है overflow:hidden


संबंधित सवाल
सबसे लोकप्रिय