In the example given in this exercise, why would we want to use the .brand selector rather than the p selector to target our paragraph?
Answer
The code snippet used in this exercise is purely for demonstrative purpose. However, you can imagine a project where we had multiple <p> elements. Say we only wanted to target a fraction of those elements for styling. We could apply a class attribute specifically to the <p> tags containing the text we wanted to style. In this case, we target the <p> elements we want to style while ignoring those <p> elements we do not want to style.
More generally, this example illustrates how we can use classes to more narrowly target groups of elements.
Do variables on computers work like this?, we could have a class and appy changes not only to the class but also to other elements that are out of that class, such as parts and sections of a program or an app?
I’m sorry if this is a too confused question
not active when I add a CSS selector:
In HTML file
Top Vacation Spots
In file style.CSS, I code that:
h1 {
color: maroon;
}
.title {
color: teal;
font-size: 40 px;
}
why the text "Top Vacation Spots" isn't maroon in colour and it changes to color teal ??? Maybe there is an order between tag
CSS reads code like we read books, left to right, top to bottom. Lets say you read this sentence
Rodger’s hair is blue.
Then you read this one
Actually, it’s green.
Roger’s hair is now green rather than blue, even though blue came first. I hope this makes sense, I’m not anything close to an expert on CSS or any code for that matter, but thats one way of understanding it.
While you are correct on how CSS reads it’s content, this is not the reason for the behavior @changpham is experiencing. If you define the .title (class) selector above the h1 (element) selector, your page will still render the .title definition rather than the h1 definition. This is because in CSS, class selectors have a higher precedence than element selectors, so your class will always override your element no matter where it’s defined in the stylesheet. However, if you had multiple .title selector definitions, your page would render the final definition of it as you had stated.
ID is an HTML attribute used to uniquely identify an element. Let’s say you want to add a style for 1 particular button, but do not want to make this change to other your buttons. You would NOT target a class because that would make the change to every element using that class. You also wouldn’t target the button element because that would implement this change for all button. Instead, you target the button by it’s ID because it’s unique and will only make a change to that one button. Hope this makes sense!
Somewhat yes, classes in this case help identify the tags for the style.css just like how an id is used to identify an attribute in html. Hope this helped!
The id attribute is used to add a unique identifier to an HTML element. It can then be used to style a specific element in CSS by using the id selector: #id . It can also be used to add functionality to a specific element using JavaScript. One thing to keep in mind is that the id attribute must be unique meaning only one element in an HTML document can have a particular id
The class attribute is also used to add an identifier to an HTML element. However, it doesn’t have to be unique. Multiple elements in the same HTML document can have the same class attribute. This is useful when wanting to style a bunch of elements in the same way