Sublime Text
<!DOCTYPE html> <html> <head> <title>Xem ví dụ</title> <style type="text/css"> #father{ position:relative; z-index:10; } #a{ width:200px; height:200px; background-color:green; position:absolute; z-index:inherit; } #b{ width:200px; height:200px; background-color:blue; position:absolute; z-index:5; top:100px; left:100px; } </style> </head> <body> <p>- Thuộc tính z-index của phần tử <u>#a</u> có giá trị là <u>inherit</u></p> <p>=> Nó sẽ kế thừa giá trị thuộc tính z-index từ phần tử cha của nó là <u>#father</u></p> <p>=> Cho nên giá trị thật sự của nó sẽ tương ứng với <u>10</u></p> <div id="father"> <div id="a"></div> <div id="b"></div> </div> </body> </html>
<!DOCTYPE html> <html> <head> <title>Xem ví dụ</title> <style type="text/css"> #father{ position:relative; z-index:10; } #a{ width:200px; height:200px; background-color:green; position:absolute; z-index:inherit; } #b{ width:200px; height:200px; background-color:blue; position:absolute; z-index:5; top:100px; left:100px; } </style> </head> <body> <p>- Thuộc tính z-index của phần tử <u>#a</u> có giá trị là <u>inherit</u></p> <p>=> Nó sẽ kế thừa giá trị thuộc tính z-index từ phần tử cha của nó là <u>#father</u></p> <p>=> Cho nên giá trị thật sự của nó sẽ tương ứng với <u>10</u></p> <div id="father"> <div id="a"></div> <div id="b"></div> </div> </body> </html>