Image Formatting dialog
The Image Formatting dialog is accessible by selecting an image in the
template and then selecting Format > Image in the
menu.
All settings in this dialog are in fact CSS properties. Cascading Style Sheets (CSS) were originally designed for use with web pages: HTML files. Since Designer templates are HTML files, they are styled with CSS. To learn how to use CSS in the Designer, see Styling and formatting and Styling templates with CSS files. For information about specific properties and their options, see W3Schools CSS Reference.
For more information about the use of images, see Images and Styling an image.
Image Tab
- General group:
- Width: Set the width
of the image in measure or percentage. Equivalent to the CSS
width
property. - Height: Set the height
of the image in measure or percentage. Equivalent to the CSS
height
property. - Angle: Set the rotation
angle of the image in clockwise degrees. Equivalent to the CSS
transform:rotate property. - Corner radius: Set
the radius of rounded border corners in measure or percentage.
Equivalent to the CSS
border-radius property. - Display: Use the drop-down
or type in the value for how to display the image. Equivalent to
the CSS
display property. - Overflow: Use the drop-down
or type in the value for how to handle overflow (the part of the image that does
not fit in the current size of the box). Equivalent to the CSS
overflow
property. - Source: Enter the web
address or local file address of the image. Equivalent to the HTML
src attribute. - Alternate text: Enter
an alternate text for the image. This is displayed in browsers
and email clients when the image is loading or if the image cannot
be displayed. It is also used for accessibility. Equivalent to the HTML
alt attribute.
- Text wrap group:
- Float: Use the drop-down
or type in the value for how to float the image, if the image is not
in an absolute position. Equivalent to the CSS
float property. - Clear: Use the drop-down
or type the value to clear pre-existing alignments. Equivalent
to the CSS
clear property.
- Positioning:
- Position: Use the drop-down
or type in the value for the type of positioning for the image.
Equivalent to the CSS
position property. - Top: Set the vertical
offset between this image and its parent's top position. Equivalent
to the CSS
top property. - Left: Set the horizontal
offset between this image and its parent's left position. Equivalent
to the CSS
left property. - Bottom: Set the vertical
offset between this image and its parent's bottom position. Equivalent
to the CSS
bottom property. - Right: Set the horizontal
offset between this image and its parent's left position. Equivalent
to the CSS
right property. - Z-index: Set the z-index
of the image. The z-index defines in which order elements appear. Equivalent
to the CSS
z-index property.
Spacing Tab
- Padding group: Defines
padding (spacing inside the element) in measure or percentage:
- All sides: Check to
set all padding to use the Top value. Equivalent to the CSS
border
property. - Top, Left, Bottom, Right:
Set padding for each side. Equivalent to the CSS
border-left, border-top, border-right and border-bottom properties.
- Margin group: Defines margins
(spacing outside the element) in measure or percentage:
- All sides: Check to
set all margins to use the Top value. Equivalent to the CSS
margin property. - Top, Left, Bottom, Right:
Set the margin for each side. Equivalent to the CSS
margin-left, margin-top, margin-right and margin-bottom properties.
Border Tab
- Same for all sides: Defines
the border properties for all sides using the Top properties. Equivalent
to the CSS
border property.
- Top, Left, Bottom, Right:
Each group defines the following properties:
- Width: Specify the
thickness of the border. Equivalent to the CSS
border-widthproperty. - Style: Specify the
style of the border such as
solid, dashed
or dotted. Equivalent to the CSS border-style property. - Color: Specify the
color of the border. The color value must be a valid HTML Color Name, or a valid HTML Hex Color.
Equivalent to the CSS
border-color property.
|
|