20 January 2017

Each item added to the web page in the WebWave creator has a set of basic attributes. These include: the location (and its size), visibility, background, border, shadow and padding. Each of these attributes can be found in the corresponding box in the bottom panel. This article will explain you these attributes.

 

Position

Visibility
Background
Border

Shadow
Padding

 

Position

 

In this box you can set the location and size of the selected item. You can set the item to cover the entire width of the web page and fix it on the screen so it will always be displayed in the same place when the page is scrolled.

 

Height and width

 

The height and width of the element is indicated in the screenshot.

 

 

Here you can manually enter the width (W) and height (H) of the element in pixels or preview its dimensions after you change it. If you want the object to keep its aspect ratio after making changes click the lock icon. This will ensure that every time you change one of the attributes, the other will automatically change so that the proportions are kept.

Hint! Do you want a few elements to have the same size? Select them all at once, and then enter the size here. All selected items will change when its size.

 

Position

 

Position of the item is indicated in the following screenshot.

 

 

Here you can enter the distance in pixels from the left edge of your web page (X) and from the top of your web page (Y). If you like to arrange your items super-precisely, you can enter here exactly where you want them to be. The distance X is the distance from the edge of the website, not from the edge of editor!

 

Fix object

 

Selecting “Fixed element” will make the selected item (or items) always display in the same place of the browser window. Customers can scroll through a web page, and the item will remain in the same place. You can thus get an interesting effects like sticky menu.

 

Width 100%

 

Selecting “Width 100%” will make the element always cover the entire width of the browser.

 

Visibility

 

There is just one tool in this box. With it, you can set the transparency level of the element. If the element is a text object, the text contained in it also becomes transparent.

 

Background

 

Background box allows you to change the background of the element.

You can set any background color or add a picture as the background.

You can choose any color from the color palette or manually enter the HEX format. You can also select the option to set a transparent background.

You can set any image from Media Library as a background. After adding an image as the background there are additional options.

 

  • Repeat X – the background image will be repeated horizontally.
  • Repeat Y – the background image will be repeated vertically.
  • Adjust – background image will be reduced to fill the entire element, but maintaining the aspect ratio. Part of the image that does not fit in the element will not be visible.

 

 

Border

 

Border options allow you to add a border to an element, select its color, size and shape, select on which sides of the element the border should be visible, as well as rounding the edges of the element.

 

Color, width and border style

 

From the color palette, you can choose any color of the border or set it transparent.

Border width is set in pixels. Changing the width does not change the size of the item, but only reduces its “capacity”.

From the drop-down menu, you can select a border style. Available options:

 

  • Solid – border is a solid line
  • Dashed – border will be a series of dashes
  • Dot – border will be a series of dots
  • Frame will consist of two solid lines with empty space between them

 

Enabling and disabling part of the border

 

Four buttons allow you to choose which part of the frame will be displayed (up, down, left, right).

 

Rounding

 

Rounding allows to create rounded edges of the element. Rounding is expressed in pixels. By entering a large enough number, you can make a round object.

 

 

Shadow

 

Shadow properties allow you to add a shadow effect to our element.

You can set:

 

  • Setting shadow horizontally and vertically
  • Shadow color
  • Blur shadow
  • Shadow transparency

 

Padding

 

Padding makes sense only for elements that have content, such as a picture or text. Enter here the value in pixels to move the content item from its borders.

GO BACK             

Elements attributes

 

 

Copyright © 2011 — 2018

All Rights Reserved

PRODUCT

CONTACT 

contact@webwave.me 

YOU SHOULD USE WEBWAVE TOO!

Try - it's free

SIGN UP

SUCCESS STORIES

HELP & SUPPORT

LANGUAGE

SIGN UP

LOG IN

SIGN UP

LOG IN