Angular | Components and Global Styling


English (Auto-generated)

this tile over component. So first of all I'm just gonna delete that because it's not necessary anyway, I'm also gonna delete, I'm not gonna do that this Anyway here I'm actually I'm actually using that and I'm not I don't need this one. I'm believing that. 1 2. Okay I just have a heading. Now I'm going to talk about this tile. So there are two ways to style a component. First way is to style the component within itself. For example, this is a component, the app dot component dot es. And it has two main files, the app dot component dot html and the app dot component dot CSS. So you can style the component by its own CSS file. And that's pretty simple. You just need to go there and you just need to write that one and or whatever you want to write. I mean there is no issue. I'm writing with some color. I'm making it orange and I'm just saving it. And now this style should be applied to you know this uh this heading because you know both are the part of the um this component dot T. S. File so absolutely whatever it's time to apply to this file, the style your ins file. It will be actually applied to this one. Um You put these tiles in this file and it's going to be applied to the uh the html file. I'm going to go to the browser to see the changes and here it is you can see that it's a um introduction which is orange. Now that means it works. Any color would work or anything. I mean any style you want to do, You can do that. Okay, that's understandable. But what if I go to the main style file? This is the component file. But in the main SRC file there is the styles dot CSS file. That's a global styles file. What is the mean of the global style files actually? And whatever you do here will be applied to every single component, including this one. I mean this component to. So if I just go there and I write the edge one and here I write something like color and I'm writing brown.
204 Views 0 Likes 0 Comments

Component and Global Styling.

Leave a comment (supports markdown format)