看過Day8、Day9、Day10三篇文章的朋友, 想必已經知道如何透過CSS來增加網站的樣式。跟所有程式語言一樣,當你在建立網站時,你會經常發現網站沒有呈現你想要的效果。 此時,你得先放輕鬆,然後檢查是否犯了以下幾種常見的CSS錯誤。
1. 檔案名稱(路徑)錯誤
首先,常犯的錯誤之一就是CSS檔案名稱打錯。 有時候,也可能是檔案路徑打錯。
趕快檢查看看檔案名稱或檔案路徑是否正確吧!
2. CSS內的單字拼錯或格式錯誤
再來,最常見的問題應該就是單字拼錯或格式錯誤。 這邊來教大家如何查找錯誤。
第一步:開啟網頁開發者工具
使用Windows的朋友只需要按F12。
若是使用OS系統的朋友,可以在網頁上按右鍵 > 顯示網頁原始碼。
此時,你會看到以下畫面。
透過網站檢查看css有沒有更動來除錯
第二步:選擇網頁上沒有預期效果的內容
點擊左上方箭頭並選擇網頁畫面。
第三步:查找問題的原因
根據以下範例,可以知道CSS的Value瀏覽器看不懂。仔細檢查發現是背景顏色少打了一個字母。
總結
今天主要介紹了如何查找CSS沒有效果的問題,之後我們就要正式開始用CSS來進行網站排版囉。