z-index 层级关系
Posted kbeer
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了z-index 层级关系相关的知识,希望对你有一定的参考价值。
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title></title> 6 <style> 7 /* .test { 8 width: 150px; 9 height: 300px; 10 border: 1px solid #ccc; 11 margin-top: 100px; 12 float: left; 13 margin-left: -1px; 14 } 15 .test:hover { 16 border: 1px solid #f40; 17 position: relative; 18 } */ 19 .test { 20 width: 150px; 21 height: 300px; 22 border: 1px solid #ccc; 23 margin-top: 100px; 24 float: left; 25 margin-left: -1px; 26 position: relative; 27 } 28 .test:hover { 29 border: 1px solid #f40; 30 z-index: 1; 31 32 } 33 </style> 34 </head> 35 <body> 36 <div class="test"></div> 37 <div class="test"></div> 38 <div class="test"></div> 39 <div class="test"></div> 40 <div class="test"></div> 41 </body> 42 </html>
以上是关于z-index 层级关系的主要内容,如果未能解决你的问题,请参考以下文章