# Learning Angular: Conditionally add styles to an element

DevFeed: [Learning Angular: Conditionally add styles to an element](<https://devfeed.tech/articles/learning-angular-conditionally-add-styles-to-an-element-21286.md>)

Original publisher: [Read original article](<https://juri.dev/blog/2016/01/learning-ng2-dynamic-styles/>)

Published: 2016-01-24T00:00:00Z

Content type: tutorial

Language: en

Sources: [Juri Strumpflohner](<https://devfeed.tech/sources/juri-strumpflohner.md>)

Topics: [Angular](<https://devfeed.tech/topics/angular.md>), [CSS](<https://devfeed.tech/topics/css.md>), [Document Object Model (DOM)](<https://devfeed.tech/topics/dom.md>), [Sanitization](<https://devfeed.tech/topics/sanitization.md>), [Security](<https://devfeed.tech/topics/security.md>), [XSS](<https://devfeed.tech/topics/xss.md>)

Tags: [angular](<https://devfeed.tech/tags/angular.md>), [code](<https://devfeed.tech/tags/code.md>), [components](<https://devfeed.tech/tags/components.md>), [css](<https://devfeed.tech/tags/css.md>), [egghead](<https://devfeed.tech/tags/egghead.md>), [how-to](<https://devfeed.tech/tags/how-to.md>), [javascript](<https://devfeed.tech/tags/javascript.md>), [learning](<https://devfeed.tech/tags/learning.md>), [xss](<https://devfeed.tech/tags/xss.md>)

## AI overview

This tutorial explains several ways to conditionally apply styles and CSS classes to DOM elements in Angular version 2 or later. It covers direct style binding, style sanitization for dynamically supplied background images, NgClass, single-class syntax, and applying classes to components.

## Source excerpt

Lorem ipsum dolor sit amet