Q:
How to use .class in css class in Vuejs?
Please, I am facing some problem in the following code:
HTML:
About
Some text
Some text
Script:
CSS:
But, the page is loading without changing the background color of #about section. I have tried many other things but in vain.
So please someone help me out.
Thanks.
A:
The thing is your code isn't using your class at all.
Your code is setting background-color of class color which is not defined anywhere in your project. It might be some plugin/dependency that is creating this class but you won't know because of your lack of information.
Here is your code fixed in the way I explained:
About
Some text
Some text
Also, your
was missing its closing tag.
I also fixed your HTML which should be (no colon used in id attribute):
If you still have some questions about your code, leave a comment and I'll be happy to answer them.
As far as I know, bootstrap or other popular CSS/JS libraries won't create any classes with . since the prefix doesn't get processed. It's possible the class you're seeing is a preprocessed version of bootstrap's classname, but most likely it's the name of your custom plugin or script that's creating it.
A:
You can do like this
.login-box{
.color{
background-color: #7c5d5c;
}
}
in this you are just making background-color as #7c5d5c and not setting a new classname.
But you should give a proper class name.
The thing is your code isn't using your class at all.
Your code is setting background-color of class color which is not defined anywhere in your project.
So if you just say color, it will search for color class and not color.class.