Book Image

Learning Dart, Second Edition - Second Edition

By : Ivo Balbaert
Book Image

Learning Dart, Second Edition - Second Edition

By: Ivo Balbaert

Overview of this book

Table of Contents (18 chapters)
Learning Dart Second Edition
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 elem element has a classes property, which is a set of CSS classes. You can add a CSS class as we did in changeBtnsBackColor (line (11)):

  elem.classes.add('cssclass');

On 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 elem.classes.toggle('cssclass'); toggle method (line (8)) is a combination of both: first cssclass is applied (added), next it is removed. 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 want to change the style of an element directly, use its elem.style style property, where the cascade style of coding (see Chapter 2, Getting to Work with Dart) is very appropriate, for example:

  newTask.style
        ..fontWeight = 'bold'
        ..fontSize...