Is there a problem linking CSS file to HTML?
Question
A little background about what I am trying to do— As of recent I have started to read Jon Ducketts “HTML&CSS” book which I am enjoying thoroughly. I finished HTML and now am beginning the CSS side of the book.
What I am trying to accomplish is making a website that shows everything the book has covered and essentially have a navigation bar to give users easier access to go throughout my website to learn about topics that are not yet clear to them (myself).
The problem is that while I am trying to style my text color it isn't changing color and for the life of me I cannot figure out why.
Is the problem within my link with the wrong file paths I specified in the head or is it a problem with how I have my classes set up in HTML and CSS?
My CSS code is at the bottom of the page that I tried to create classes with. Since you need a “10 reputation” to post photos I'll be writing my HTML / CSS file name and folder path here.
Name- newWebsiteFinalCSS.css Folder Path- C:\\Users\\MyName\\Desktop\\Website
Name- newWebsiteFinal.html Folder Path- C:\\Users\\MyName\\Desktop\\Website
.headingcolors { color: red; } .p { color: red; }
<!doctype> <html> <head> <title>Final HTML CSS Website</title> <link type="text/css" href="Website/newWebsiteFinalCSS.css" rel="stylesheet"> </head> <!-- This section i want to create a link to different topics within my own website so it is easier to go throughout the site and only look at things you want to be reasearching about if you come across a problem with a topic about HTML or CSS. --> <header class="topnav"> <a href="#home">Home</a> <a href="#text">Text</a> <a href="#lists">Lists</a> <a href="#links">Links</a> <a href="#images">Images</a> <a href="#tables">Tables</a> <a href="#forms">Forms</a> <a href="#extramarkup">Extra Markup</a> </header> <!-- insert navigation bar here --> <body> <h1 id="top" class="headingcolors"> Welcome to my first Web Page created with HTML & CSS </h1> <p>//// During the process of making this website, I will be showing you how I learned to do simple webpage making with very easy to understand the code. This code includes languages called HyperText Markup Language (otherwise known as HTML), and a styling language called Cascading Style Sheets (otherwise known as CSS). This website was made possible by reading a book called <i>HTML&CSS; design and build websites</i> by Jon Duckett. I am a fan of Jon Duckett's book and it made me feel excited to read something that was so interesting and brought color to such a fundamental topic of learning a computer language. This website will be a work in progress with perfecting every single topic covered in HTML as well as styling my webpage and making it a professional looking website that any CEO or businessman would be interested in reading. I hope you enjoy browsing casually throughout my website and enjoying some of the topics as much as I did learning about them! ////</p> <h2 id="text" class="p">Texts</h2> <p>This is some text, hopefully i can figure out how to add color.</p> <br> <br> <br> <br> <br> <br> <h3 id="lists" class="p">Lists</h3> <p>This is some text, hopefully i can figure out how to add color.</p> <br> <br> <br> <br> <br> <br> <h4 id="links" class="p">Links</h4> <p>This is some text, hopefully i can figure out how to add color.</p> <br> <br> <br> <br> <br> <br> <h5 id="images" class="p">Images</h5> <p>This is some text, hopefully i can figure out how to add color.</p> <br> <br> <br> <br> <br> <br> <h6 id="tables" class="p">Tables</h6> <p>This is some text, hopefully i can figure out how to add color.</p> <br> <br> <br> <br> <br> <br> <h7 id="forms" class="p">Forms</h7> <p>This is some text, hopefully i can figure out how to add color.</p> <br> <br> <br> <br> <br> <br> <h8 id="extramarkup" class="p">Extra Markup</h8> <p>This is some text, hopefully i can figure out how to add color.</p> <a href="#top">Top of Webpage</a> </body> </html>
1 answers
solution1
0 ACCPTED 2019-05-12 22:30:59
<link type="text/css" href="Website/newWebsiteFinalCSS.css" rel="stylesheet">
is relative to the html file.
If the html file is in C:\\Users\\MyName\\Desktop\\Website.
Then the link is pointing at C:\\users\\MyName\\Desktop\\website\\Website\\newWebsiteFinalCSS.css
It should be
<link type="text/css" href="newWebsiteFinalCSS.css" rel="stylesheet">
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.