幾道常考的前端面試題（蘑菇街）系列一
阿新 • • 發佈：2019-01-07
今天，偶然在網上看到幾道蘑菇街的筆試題，感覺這些都是前端必考必會的一些常規題，之前做阿里筆試題的時候也碰到其中幾道， 特此哈拿來給自己練手。
好棒啊，CSDN寫部落格，前面不小心關了頁面，都給我自動儲存了，贊一個!!!
自己寫的答案，有不對的，歡迎大家指正，或者有哪些可以完善的地方，也希望小夥伴們多意見哦！！！
1. position屬性值：
1)static 2) absolute 3)relative 4)fixed 5)inherit 各值的感化是個什麼意思？我寫一下各值的作用和區別吧。
1)static ：是一個預設值，使元素出現在正常的文件流中。left,bottom,right,top,z-index都沒用，沒有定位。
2) absolute ： 生成絕對定位的元素，但又是相對的，相對於static定位以外的第一個父元素進行定位。脫離正常的文件流
3)relative ：生成相對定位的元素，相對於它在文件流中的正常位置進行定位。沒有脫離文件流
4)fixed ： 生成絕對定位的元素，是相對於瀏覽器視窗定位的。 脫離正常的文件流
5)inherit： 從父元素繼承position屬性的值。
2. 兩列等高，左列固定寬度300px,右列寬度自適應。
方法一： 採用彈性盒佈局法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>左列定值，右列寬度自適應（彈性盒佈局法）</title> <style> .main{ width: 100%; height: 600px; display: -webkit-box;} .left{ width: 300px; height: 600px; border: 3px solid #FF1B79; -webkit-box-flex: 0;} .right{ height: 600px; border: 3px solid #02A6E0;-webkit-box-flex:1;} </style> </head> <body> <div class="main"> <div class="left"></div> <div class="right"></div> </div> </body> </html>
昨天下午寫的，後來去跟室友過七夕了，沒有寫完。這個七夕節跟我沒半毛錢關係，一整天，沒花，沒禮物，沒電話，沒簡訊，憂傷.......
不過， 有室友陪著，嘻嘻，兩個好姐妹一起過的七夕也是難忘和甜蜜的，喜歡的包包，喜歡的秋冬裝，愜意的晚飯，感謝有你@誼.......