CSS is not linked to HTML - css

Question

I'm not sure how to link CSS to the HTML. Here's how I link currently:
<link href="styles/main.css" rel="stylesheet" type="text/css"/>
But when I do so and save it, I don't see any changes, so I've resorted to using the <style> tag. I'm also using Sublime Text if that has anything to do with the issue:
<style type="text/css">
body {
background: green;
color: black;
background-color: red;
}
</style>`

Answer 1

Try an absolute path.
Change:
<link href="styles/main.css" rel="stylesheet" type="text/css"/>
to
<link href="http://yourwebsite.com/styles/main.css" rel="stylesheet" type="text/css"/>
If that doesn't work please edit your question to include the contents of your main.css file as this may be a simple misunderstanding on how to write a stylesheet.
Happy coding.

Answer 2

<link href="styles/main.css" rel="stylesheet" type="text/css"/>
As written, your main.css file has to be in a subfolder called "styles", relative to your html document.
Here is the structure visualised:
If you had the main.css file in the same folder, you could change the link tag to be:
<link href="main.css" rel="stylesheet" type="text/css"/>

Answer 3

As others have stated it's likely that the path is wrong. Try appending that path to the url of the html page, minus the html file.
eg: http://www.mysite.me/index.html becomes http://www.mysite.me/styles/main.css
If the css file doesn't come up then your path is incorrect.
If your css file includes the <script> and </script> that is your issue. The CSS file should only include the style sheet text, and those tags are for entering a style sheet inside the HTML and not using a link as you seem to want to do (props to you ;))
The content of your main.css file should look exactly like:
body {
color: black;
background-color: red;
}

Answer 4

If you are using Chrome, press CTRL + U and right click the main.css and open it in a new tab. If the file can't be displayed, the path is probably wrong