简体   繁体   中英

Why is my CSS/JS not working on Github pages?

I have looked through many similar questions and tried several different solutions, but I do not understand what I am doing wrong. Examining the console did not help me either.

I am new, and am attempting to use Github pages, but cannot get my page to work. I created this in codepen, and it looked fine and functional there. I assume the issue is in how I am linking my CSS and JS to the HTML.

I tried changing my CSS and JS links several times to no avail. I have no idea what I am doing wrong. Any suggestions are greatly appreciated.

Here is my HTML code:

<!DOCTYPE html>
<html lang= "en">
  <head>
    <meta charset= "UTF-8">
    <meta name= "viewport" content="width=device-width, initial"
    <title>Digital Clock:</title>
    <link rel="stylesheet" type="text/css" href="/master/style.css">
  </head>

  <body style="background-color:#f28500;">
    <link href="https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap" rel="stylesheet">
    <div class="clock">
      <h2><strong>XENA's sundial says:</strong></h1>
      <span class="clock-time"></span> 
      <span class="clock-ampm"></span> 
    </div>
    <script src="/master/digitalClock.js"></script>
    
  </body>
</html>

Here is the link to my actual repo.

******************************************************////
******************************************************////\

UPDATE: I deleted all the above code and link. Please see my answer below for an explanation as to what happened as I somewhat solved the issue.

Urls starting with / mean start at the root folder, so you need to change it to be /YOURPROJECTNAMEHERE/restofurl where YOURPROJECTNAMEHERE is your project name and restofurl is the rest of the url

I have figured it out. For some reason, with the code being from codepen, you must export the code to use it, not just copy/paste it (as I had done). I am still unsure as to why I could not get it to work before, however, I deleted everything, and started with a fresh repo and freshly exported code straight from codepen. I did not alter any code. It worked. Previously I copy/pasted it. Further, I uploaded the files from the "src" folder from codepen. I hope this helps somebody in the future.

should be test your project on server by tools like live server this package related to vscode ide

after install live server

在此处输入图像描述

then after run head over to browser in here test address as manual

在此处输入图像描述

explain address

example: where address file talk.ppt

  • ./work/project/talk.ppt

在此处输入图像描述

and final step deploy in github

在此处输入图像描述

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM