一階段項目開始的第一天所遇到的問題和解決（瀏覽器滾動條的變相隱藏，div的邊框陰影效果，圖片的色彩漸變）
滾動條的隱藏：
1. 把body的橫向，縱向的超出部分隱藏，寬設置100%；高設置100%。就沒有body的滾動條了，
2. 然後把最外層的div的寬設置的比body的寬寬一點，把div的滾動條擠出去，並把div的橫向超出部分隱藏掉，就可以實現沒有滾動條也可以滾動的效果
<html> <style> *{ margin: 0; padding: 0; } .scroll{ overflow-x: hidden;overflow-y: hidden; } .scroll-son{ overflow-x滾動條代碼: hidden; } </style> <body style="height:100%; width: 100%;" class="scroll"> <div style="height:101%; width:102%;; background: #ccc; margin: 0 auto;" class="scroll-son"> <div style="background: white;" > <p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p> </div> <div> <p>2</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>2</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p> </div> </div> </body> </html>
div的邊框陰影效果：
1.理解的不是很清楚，
原點為基點，原點左側為x軸負方向，值為負，右側為正；原點下方為y軸正方向，值為正，上方為負。如上圖箭頭所指。好理解嗎？不要嫌我啰嗦，正確理解坐標方向對於理解陰影畫法至關重要。
官方用語： box-shadow:1px 2px 3px 4px #ccc inset；
來分別看一下以上六個值的含義： 1px 從原點開始，沿x軸正方向的長度（倘若為負值，為沿x軸負方向的長度）；
2px 從原點開始，沿y軸正方向的長度；（倘若為負值，為沿y軸負方向的長度）；
3px 陰影的模糊度，只允許為正值；
4px 陰影擴展半徑；
#ccc 陰影顏色；
inset 設置為內陰影（如果不寫這個值，默認為外陰影）；
我們再詳細點說，所謂內外陰影，其實就是指的是陰影在div的外面一圈還是在div的裏面一圈，如下圖：
外陰影 
內陰影
/*說明：（以上部邊為例進行說明）
1. 對於上邊，沿x軸方向的偏移量顯然沒有意義，設為0px；
2. 沿y軸正方向陰影進入div內部，不顯示，因此寫為負數；
3. 擴展半徑不要寫，或者寫成0px，這樣就不會影響其他的邊；
4. 顏色自定；
5. 模糊程度按需要自定；
6. 下、左、右邊陰影按規律類推。
*/
box-shadow: 0px -10px 0px 0px #ff0000, /*上邊陰影 紅色*/
-10px 0px 0px 0px #3bee17, /*左邊陰影 綠色*/
10px 0px 0px 0px #2279ee, /*右邊陰影 藍色*/
0px 10px 0px 0px #eede15; /*下邊陰影 黃色*/
陰影漸變
圖片效果：
外陰影加好了。倘若是內陰影，可以按這個規律自己推一下。
試驗中發現了一個問題：
對於上下邊，相當幹凈漂亮。但是寫左邊的陰影時，上邊會有一條細細的陰影；寫右邊陰影時，下邊會有一條細細的陰影。不懂為什麽。
圖片背景圖的顏色漸變：
background: linear-gradient(#141414,#1A1A1A);
背景使用CSS漸變顯示可以不使用圖像就實現兩個或兩個以上的指定顏色的平滑過渡。這反過來又減少了下載時間和帶寬的使用，放大時也比較好看，可以讓您創造出一個更靈活的布局。
這兩個屬性分別為linear-gradient（線性漸變）和radial-gradient（徑性漸變）,其中linear-gradient線性漸變呈現線性變化，大家一看名稱就可以知道這相當於是直線變化，
比如充左上角到右下角的變化，或者從上到下，而radial-gradient徑性漸變呈現徑性變化，這便是大家經常見到的圓圈漸變效果，從圖像的中間向四周進行變化，像是大家仍塊石頭到
河裏蕩起的漣漪一樣。
一階段項目開始的第一天所遇到的問題和解決（瀏覽器滾動條的變相隱藏，div的邊框陰影效果，圖片的色彩漸變）