Thuộc tính isolation dùng để xác định liệu một phần tử có phải tạo ra một stacking context (ngữ cảnh chồng lớp) mới hay không. Cú pháp như sau:
Cú pháp
isolation: auto | isolate | initial | inherit;
Ví dụ
<!DOCTYPE html> <html> <head> <style> .demo1 { background-color: orange; } #demo2 { width: 300px; height: 400px; } .demo3 { width: 150px; height: 120px; border: 3px dashed blue; padding: 5px; mix-blend-mode: difference; } #demo4 { isolation: isolate; } #demo5 { isolation: none; } </style> </head> <body> <h1>Demo Heading</h1> <div id="demo2" class="demo1"> <div id="demo4"> <div class="demo1 demo3">isolation: auto property value</div> </div> <div id="demo5"> <div class="demo1 demo3">isolation: isolate property value</div> </div> <div id="demo4"> <div class="demo1 demo3">isolation: auto property value</div> </div> </div> </body> </html>
Kết quả
