How to link to external files from HTML


#1
       <link rel = "stylesheet"
          type = "text/css"
           href = "style.css" />
        
</head>
    <body onresize="drawingArea.onScreenSizeChanged()">
    <canvas id="canvas" width="500px" height="500px"> Your browser does not support the HTML5 "canvas" tag. </canvas>
    <div id="controls" class="hidden">
        <div class="control-group">
            <label for="color-input">Color</label>
            <input id="color-input" class="input" type="color" value="#000000"></input>
        </div>
        <div id="color-buttons" class="control-group">
        </div>
        <div class="control-group">
            <label for="brush-size">Brush Size</label>
            <input id="brush-size" class="input" type="number" min="1" value="1"></input>
        </div>
        <div class="control-group">
            <a id="clear-canvas">Clear Canvas</a>
        </div>
    </div>
    <div id="controls-opener">
        <svg width="30px" height="30px">
            <g id="open-controls-button">               
                <line x1="6" y1="6" x2="24" y2="6" style="stroke-width: 3; stroke: white;" />
                <line x1="6" y1="12" x2="24" y2="12" style="stroke-width: 3; stroke: white;" />
                <line x1="6" y1="18" x2="24" y2="18" style="stroke-width: 3; stroke: white;" />
                <line x1="6" y1="24" x2="24" y2="24" style="stroke-width: 3; stroke: white;" />
            </g>
        </svg>
    </div>
 <script type="text/javascript" src="style.js"></script>
</body>

im trying to link folder called style.js and one called style.css in my html folder i tried these but they arnt working
CSS folder

  JS folder

please help


#2

You’ll want to make sure you’re including the file according to what directory it is in. If your .html file is in the same folder as your style.css file then you can include it as you mentioned. If it is in a folder called CSS then you’d want to do something like this:

<link rel="stylesheet" type="text/css" href="CSS/style.css" />

Note: I removed spaces and returns so the style is more standard but this doesn’t affect the functionality.

You might also take a look at this Stack Overflow question that can help out.