关于阿里面试的一个小题（推荐）
生活随笔
收集整理的這篇文章主要介紹了
关于阿里面试的一个小题（推荐）
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
最近搜到的阿里一個面試小題要求如下：
用div+css做出如下效果：
用js做出：
當鼠標懸停在紅色div上時，div放大，并且不占擠其他盒子效果如下：
代碼如下
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" 2 "http://www.w3.org/TR/html4/strict.dtd"> 3 4 <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> 5 <head> 6 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 7 <title>阿里小筆試</title> 8 <script type="text/javascript" src="script/jquery-1.12.2.js"></script> 9 <style type="text/css"> 10 body { 11 padding: 0; 12 margin: 0; 13 } 14 .small1 { 15 box-sizing:border-box; 16 background: #FF0000; 17 width: 100px; 18 height: 100px; 19 position: relative; 20 z-index: 1000; 21 } 22 .small2 { 23 box-sizing:border-box; 24 background: #008000; 25 width: 100px; 26 height: 100px; 27 position:absolute; 28 top: 100px; 29 z-index: 100; 30 } 31 .big { 32 box-sizing:border-box; 33 background: #808080; 34 width: 100px; 35 height: 200px; 36 position: absolute; left: 100px; top:0; 37 top: 0px; 38 z-index: 100; 39 } 40 </style> 41 <meta name="author" content="Administrator" /> 42 <!-- Date: 2016-04-06 --> 43 </head> 44 <body> 45 <div class="small1"></div> 46 <div class="small2"></div> 47 <div class="big"></div> 48 <script type="text/javascript"> 49 $(function(){ 50 $(".small1").hover(function() { 51 $(this).css({"width":"120px","height":"120px"}); 52 }, function() { 53 $(this).css({"width":"100px","height":"100px"}); 54 }); 55 }); 56 </script> 57 </body> 58 </html>?
轉載于:https://www.cnblogs.com/Arther-J/p/5358149.html
總結
以上是生活随笔為你收集整理的关于阿里面试的一个小题（推荐）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 转帖Jmeter中的几个重要测试指标释义
- 下一篇： 用Code::Blocks Code p