I am new in markup languages and I am facing issue while applying my first css file to my index.html. Here is how I used link tag in html filecss file: index.html code

I checked network tab in developer tools, css file is loading but when I click on any particular tag to see its styles, it not showing there. I am adding css file and network tab screen-shot below: Network tab not showing the applied css

CodePudding user response：

1. Check if you have imported the css file in index.html. (I guess you should've because its showing in network tab)

2. Check in the developer tools > Elements. Click on the arrow pointer on left side of the Elements tab beside Toggle Device toolbar. Or press Ctrl Shift C. Now hover over the elements you assigned your styles to.

3. Also when you hover, click one element and check if the styles are applied on the right side of the Elements tab in the Styles section in dev tools. Find your element and check if the styles you defined are applied.

4. if thid doesn't work, check in the same Styles tab if the styles you defined are being overridden by some other styles.

CodePudding user response：

h1:{
    color: red;
}

So, that is not a valid CSS code. Instead you should right something like this:

h1{
    color: blue;
}
h1:hover{
    color: red;
}

That is the example of normal and hover state. Hope that will solve the problem.