غموض CSS3 الملكية

Question

وكيف يمكنني تؤثر على التعتيم فقط من العنصر الأصلي وليس لها أطفال

وعلى سبيل المثال،

وأريد signup_backdrop التعتيم على أن تحدد عند 0.5 ولكن هذا signup_box عنصر تابع أنا لا أريد أن يكون له أي غموض على الإطلاق، بل أنها لن تطبق التعتيم المنصوص عليها في signup_backdrop كما الموروثة.

Answer 1

وأنت لا تستطيع ذلك. ستحتاج إلى super-فرض (تحديد المواقع، ومؤشر ض) الأطفال على الوالدين، وهذا يعني أنهم لن يكونوا أطفالا. ذلك، أو استخدام الشفافية في PNG لخلفية الأم، ومجموعة التعتيم على أي إخوة للطفل مبهمة تماما.

* لم تختبر، ولكن يجب أن تكون جيدة.

.signup_backdrop {
  position:fixed;
  top:0; left:0;
  background:#333333;
  width:100%; height:100%;
  z-index:10;
}
    
.signup_box {
  position:fixed;
  top:25%; left:25%;
  background:#ffffff;
  width:50%; height:50%;
  z-index:20;
}

<div class="signup_box">
   <p>Hello World</p>
</div>
<div class="signup_backdrop"></div>

Answer 2

في CSS 3 لديك rbga () لإضافة لون والتعتيم ل عنصر معين.
ويتم تنفيذ ذلك حتى الآن في سفاري 3 و فايرفوكس 3 فقط.
لمتصفحات أخرى استخدام الحيل من الجواب جوناثان سامبسون.