Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialmarc ohlsson
Courses Plus Student 8,045 Pointscreating a new page
when using the 'select ' 'class'' that has been created ,what and where in the css folder does the html link to?.
3 Answers
Diego Lucero
10,588 PointsI agree with Misty here, I'm not sure what you are asking.
I assume that you are asking about the selected
class that you are moving from the index.html
to the about.html
page?
I believe the question that you are asking is what the code in the HTML: class="selected"
links to?
If this is the case, it links to the main.css file in a class called selected. You can find the "selected" class selector in your CSS file with text that looks like this:
.selected {
/* The below code is not relevant to this topic */
width: 100px;
height:40px;
border: none;
}
Misty Majewski
5,276 PointsI'm not sure exactly what you are asking. CSS will change whatever you tell it to.. Example would be if you have a div with the class of background and in the css you would specify that the background class should be green. Then that div will be green. you have to set up the css file and tell it what you want. It sounds like you are new to html and css. I started with the HTML foundations and then did the CSS foundations. It goes slow and will help you learn the why and how it works together. the css folder and the html file have to be linked together. I believe that it is covered in the beginning of the css foundations deep dive.
marc ohlsson
Courses Plus Student 8,045 PointsI understand the syntax. Now since css cascades and is read in a specific order ex. two seperate style sheets linked to a index.html file in the header area of the index.html file will be read last to first . SO should your .selector class be at the top of the css file or at the bottom by the footer, or just stay within in the nav element, or create a div tag to redirect to ...about.html.
Diego Lucero
10,588 PointsIn the Video, Nick Pettit shows where and how the CSS class selector should be put into the HTML file.
As for the CSS's cascading styles -- they really only really affect other things if you have styles that are meant to override other styles. In this case, the selected
class selector overrides the default styling (the stuff you previously set up.)
Nick shows you where to place the CSS style rules in the video also. It should be towards the bottom of the CSS file.
Diego Lucero
10,588 PointsAs for CSS overrides -- If you have multiple stylesheets, the browser loads the documents in order as they are listed in the HTML document. I don't believe you have that case.
If you have the single stylesheet, the browser just loads the styles from that one CSS stylesheet in the order that it is written into the document. Which means, the styles at the very top of the document are loaded before the styles in the middle and below everything.
In the CSS stylesheet, any styles that style the same HTML elements, CSS classes, and CSS IDs that are loaded after the initial style set, will override. This means that any CSS style rules that re-style you own CSS on a certain condition -- will be below the initial styles for those elements, classes or IDs that you write.
It will all become more clear as you go through the course, and as you get into the CSS Foundations Deepdive.
marc ohlsson
Courses Plus Student 8,045 Pointsmarc ohlsson
Courses Plus Student 8,045 Pointsso simply add a .selected anywhere in the css file.
Diego Lucero
10,588 PointsDiego Lucero
10,588 PointsYes, that will select the
selected
class that you put into your markup. It should be good to know that the proper syntax for a class selector in css is like this with curly brackets({
and}
) opening and closing the rules you add to it: