2020.2

Styling an image
Just like many other elements, images can be given borders and rounded corners, and they
can be rotated. How to do this isn't any different from the way it is done with other elements, so
it isn't described in this topic, but in general formatting topics; see "Styling and formatting" on
page286.
This topic discusses specific image formatting issues.
Note that image characteristics like brightness and contrast can not be changed within the
Designer.
Local formatting vs. style sheets
Just as other elements, images can be styled in two ways:
l
With local formatting. This means styling the image directly, using the Formatting dialog.
l
Via Cascading Style Sheets (CSS). In a style sheet, style rules are declared for
elements with different HTML tags, ID's and classes.
See "Styling and formatting" on page286 for background information about these two methods.
Applying local formatting to an image
To apply local formatting to an image, either:
l
right-click the image and select Image... from the contextual menu
l
click the image and select Format > Image... from the menu.
For an explanation of the available options, see "Image Formatting dialog" on page473.
Applying style rules to an image
To format an image via a style sheet, first give the image an ID or class: select the image, and
enter the ID or class on the Attributes pane. This makes it possible to make the CSS style rule
target this image specifically, or a set of images with the same class. A style rule with the
selector img (the HTML image tag) would apply to all images.
Next, create the style rule; see "Styling templates with CSS files" on page287. Note that when
a property isn't present in the style rule editor, it can still be used: click the Advanced button in
the style rule editor; enter the property under Property, and its value under Value.
Page 312