I am working on creating a webpage using Angular and I have three different stylesheets that are being called in all pages. However, I now need to apply a specific CSS block only to my home page. I attempted to use a less file for this purpose.
HTML:
// The following code is for the home page
<div class="homePage">
<div class="content">
</div>
</div>
//This code is for inner pages
<div class="content">
</div>
CSS:
.homePage
{
.content
{
background-color: #F00;
color: #FFF;
}
}
.content
{
background-color: #000;
color: #FFF;
}
Unfortunately, the above code is not functioning as expected. Any help would be greatly appreciated.