南臺科技大學

css顯示不出來

6月2日 17:53
朋友最近在學html 朋友A寫完一個段落檢查網頁,發現沒有css 但是css的link、名稱、位置,甚至語法本身都沒問題 於是A把檔案傳給我跟朋友B做確認 我跟朋友B打開A的網頁也是沒有css 找很久都找不到原因,於是我重開一個檔案 把A打的語法複製貼上再把我這份檔案傳給A、B 以及用其他電腦做測試 B跟其他電腦在瀏覽器上面檢視都有出現css 但A打開我的檔案檢視一樣只有html的內容而已 Google了很久,utf-8那個方法也試過沒用 第一次遇到這個問題 真的很想知道到底發生什麼事🤔🤔 以下是語法 (css跟html是放在同一個資料夾) html: <!DOCTYPE html> <html lang="zh-Hant-TW"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>div</title> <link rel="stylesheet" herf="./style02.css" /> </head> <body> <nav class="nav active"> <div class="container"> <hi class="logo"><a href="#">my web</a><h1> <ul> <li><a href="#">Home</a><l1> <li><a href="#">Intro</a><l1> <li><a href="#">Projet</a><l1> <li><a href="#">Contact</a><l1> </ul> </div> </nav> <div class="main"> <div class="container"> <h1>Welcom to this home page</h1> <p>Good Morning to everyone , are you crazy?</p> </div> </div> <section class="container content"> <h2>Part one</h2> <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Quod quisquam atque recusandae saepe temporibus error, numquam dolorum nihil facere aliquid autem ex, iste fugit et praesentium quas iusto soluta. Omnis.</p> <h2>Part two</h2> <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Dolore, quas ullam? Voluptatum perspiciatis quis distinctio quibusdam eaque reprehenderit cumque ipsum autem. Dolore est dolores ratione eius. Reiciendis impedit sit rem?</p> </section> </body> </html> —————————————————— css: *{ box-sizing: border-box; margin: 0; padding: 0; font-family:Arial, Helvetica, sans-serif; } body{ background-color: #222; padding-bottom:50px; } .main{ background-image: url(img/sam.jpg); background-size:cover; background-position:bottom center; height:100vh; justify-content: center; color: white; align-items:center; text-align:center; margin-bottom: 20px; position: relative; } —————————————————— 以下是討論截圖,雖然不知道有沒有用但還是貼上來 因為有講一些幹話所以裁掉了,但有依照順序放 有標示A、B 從我幫他們改檔案開始的截圖
B朋友打開我的檔案,表示跟之前打開的有不一樣 上面白色底是A朋友的檔案 下面那張橘色底是我修改過檔案打開的樣子 ——————————————————
但是A朋友打開我的檔案依然是沒有css的狀態
—————————————————— 另外A朋友無論在visual studio code裡面開檔案 還是直接把資料夾打開在外部雙擊html這個檔案 打開的結果都是一樣沒有css 但其他電腦用這兩個方法開都有出現css
4
回應 15
文章資訊
共 15 則留言
國立臺灣大學 資訊管理學研究所
資訊太少了無法判斷,使用的瀏覽器一樣?用開發者模式檢查看看呢?
原 PO - 南臺科技大學
B1 有想過是不是軟體的設定 但我們三個一致使用 visual studio code 設定也沒有改 把html打開的瀏覽器也一樣是使用chrome 有請A同學用edge開,一樣沒有css F12查看問題是顯示 devtools failed to load sourcemap 有找過方法,說是瀏覽器的設定要勾選某一項 但勾了也沒反應QQ
嶺東科技大學
這樣真的很抽象
國立臺灣大學 資訊管理學研究所
B2 你不如把完整程式碼貼上來,不然真的只能用猜的了⋯
原 PO - 南臺科技大學
B3 B4 已把語法跟對話內容補上
匿名
這則留言已被本人刪除
6月2日 20:58
已經刪除的內容就像 Dcard 一樣,錯過是無法再相見的!
可以直接上傳朋友A的原始檔嗎?
原 PO - 南臺科技大學
B7 在這裡
B8 html 裡 css 的 href 寫成 herf 了
國立臺中科技大學 資訊管理系
是不是link css 檔案錯誤了
原 PO - 南臺科技大學
B9 啊!謝謝你,可以了 但還是很好奇為什麼A同學開我的檔案有問題 還是說他只是純粹開錯檔案🤔 等遠距結束再檢查看看好了XD 非常感謝大家
B11 可能開錯吧,或是沒解壓縮直接點開 html?
國立臺北大學
建議裝一下Emmet 就不會出現herf 這種無言的錯誤了
我發現 幾乎每個問題裡 你都會出現 解答 B12
B14 額... 因為我有在關注工程師版,大家踩到的雷會好奇想知道怎麼解,自己踩過或大概知道怎麼解的就會留言。其實很多同樣的人也有在解答,只是我用卡稱比較明顯😅...