adding css to gtk4 application

Question

I have a ui definition file as follows:

<object class="GtkLabel" id="view_header">
   ...
</object>

and css as follows:

#view_header { font: 1.2em bold }

Since the class attribute is already used to define the ObjectClass, how do I define a "css class" that I can use to select multiple view headers?

score 1 · Answer 1 · answered Sep 10 '22 at 15:41

You should use the css-classes property of your object to set the classes that are applied to it. For example, changing your object to use a custom some-class:

<object class="GtkLabel" id="view_header">
  <property name="css-classes">some-class</property>
</object>

Then, on your .css file, you just define your styles as usual.

#view_header { font: 1.2em bold }

.some-class {
  // whatever you want...
}

#view_header.some-class {
  // whatever you want...
}
...

adding css to gtk4 application

1 Answers1