Book Image

Learning Dart

Book Image

Learning Dart

Overview of this book

Table of Contents (19 chapters)
Learning Dart
Credits
About the Authors
About the Reviewers
www.PacktPub.com
Preface
Index

Manipulating the style of page elements


CSS style properties can be changed in the code as well: every element elem has a classes property, which is a set of CSS classes. You can add a CSS class as follows:

  elem.classes.add('cssclass');

as we did in changeBtnsBackColor (line (11)); by adding this class, the new style is immediately applied to the element. Or, we can remove it to take away the style:

  elem.classes.remove('cssclass');

The toggle method (line (8)) elem.classes.toggle('cssclass'); is a combination of both: first the cssclass is applied (added), the next time it is removed, and, the time after that, it is applied again, and so on.

Working with CSS classes is the best way to change the style, because the CSS definition is separated from the HTML markup. If you do want to change the style of an element directly, use its style property elem.style, where the cascade style of coding (see Chapter 2,Getting to Work with Dart) is very appropriate, for example:

  newTask.style
        ....