KNOWLEDGE CENTER

 

 



 

 

 

 

 

 

         

 Insert a Table; Step Two: Styles

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Webtreepro will show you how to make your Table come alive with color and/or

 

 images inserted into the background. 

 

 Adding color  and images to your Table helps make it more appealing.

   

We will show you several ways to do this.

 

 

 

 

 

 

 

 

As this page is the second step in creating a Table, and if you have come to this page without first seeing the page 

Insert a Table; Common Properties, you may want return to the first step, or click here.  

         
 

   1.    Now that you have finished making choices on the Common Properties tab, click the Styles tab.  Don't worry about losing the

          choices you've made in Common Properties.  When you are finished with the Styles tab, you will be able to save all your choices

          from both tabs at the same time.

 

    2.   The Styles window comes up, as seen below.  This is where you can select Colors or Images to put into your Table.

 

 

 

 

 

 

 

Adding Background Color and Borders to Tables:

 

         

   1.   To add a Background Color to a Table, enter a Hex Color Code in the text bar where it says transparent. Or you can click

          on the square to see the Color Palette, seen below.  Then, just click on the color of your choice. 

 

     2.   Follow the same process when choosing a color for the Table's border.

 

 

Note: 

 

You may have already chosen the Border's thickness on the Table's "Common Properties"  tab. 

 If you didn't  choose a width for the Border, no matter what color you choose in the Style tab, it won't

 appear. 

 

 You must choose a Border Thickness before you can choose a color. 

 

 If you find yourself in this situation, just return to the "Common Properties" tab, and select a Border Thickness.

 

            

 

      •  If you want your Background and Border to show whatever is placed in the background of the page, select Transparent.

 

      •  If the first palette doesn't offer the color you want, click on More Colors... located at the bottom of the first color palette.  A more

                     extensive color palette will come up, seen to the right.  As you move your cursor across this palette, the color code will appear

                     in the Custom Color bar.  Click OK to select the color.  Or you can enter a Hex Color code.

                    

   3.   The Preview box in the upper right corner of your screen will show you an example of how the Table will look. The Preview gives you

          a chance to make changes before placing the Table in your page.  These actual results are seen below Table Properties window,

          seen here. 

 

 

 

 

 

 

 

      • Be sure to experiment  with Border colors and Background colors.  Try putting a smaller Table into an existing Table, and use bright colors for each Background and  Border. 

 

      • Below is an example of a single cell Table that has a 2nd one inside.  The larger Table's colors are two shades of green.   The dark green is the Border color of 8 pixels.  The light green is this Table's Background Color.   The smaller one that has been placed inside the large one has a bright yellow Border color of 8 pixels and an orange Background Color. 

  

First Table 

 

Second Table 

 

 

 

This is what the combined Tables looked like before an image was inserted.

 

 

 

 

When we inserted the image into the Table with the orange background, the smaller Table "grew" to accommodate the image.

 

 

 

         

 

Adding a Background Image to a Table: 

 

   1.   If you want to place an image in the background of your Table, right click in it to cause the Page Details window to appear. Click

         Table to cause the Table Properties flyout to popup. 

 

   Page Details  

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Table Properties flyout

 

   2.   Select Table Properties which will take you to its window with its two tabs.  Select the Style tab.            

 

 

                                                                  

 

 

 

 

            • Next to Background Image is the word Select.  Click on it and Webtreepro will take you to your Library where you can search for an appropriate image. To see more about searching for images, see the page The Library, 

                                   or click here.

 

   2.   Choose your Background Image, and click the "Select" button at the bottom of the Library page which will bring you back to

          the Styles tab.

 

            • At this time, you will see two more options next to Select which are Preview and None.
            • To preview your Background Image, click on Preview.
            • Click None to cancel your selected image.

   

 

 

 

 

 

     3.   The dropdowns under Select are explained below.

   4.   If you choose to have an Image in the Table's background, you'll need to decide if and how you want your Background Image

         to repeat. 

                        

  5.   Background Repeat offers these 4 choices:

 

          • Repeat means the background will repeat across all Cells evenly.
          • Repeat-x means the image will repeat horizontally. 
          • Repeat-y means the image will repeat vertically.
          • No-repeat means the image will be fixed in one area only.

 

 

   6.   The dropdown from Background Position is to the right. Webtreepro

         automatically starts the Background Image at the upper left corner of the Table,

         (the default) but you can choose these other options.

 

          • Because every Background Image is different, we suggest you experiment with these positions, and choose the one that is best for your Table.

 

 

     7.   Click OK   to save.  Your selections in both windows of Common Properties and Styles will be saved at the

          same time.

          Click Cancel    to exit without saving a Background Image.

 

          • Depending on the size of your Table or the size of your image, you may or may not see the entire Background Image, as seen in the example below.

 

 

 

 Original Image

 

 

          • Other Background Images can be used also, such as graphic patterns, or color shadings, as seen below.  There are many online sites which offer free Background Images, such as these. Or you can ask us to supply a certain graphic by contacting us.  Use the Need Help? link located at the bottom of this page.

                               

 

 

      • Be sure to visit the page, Tables-Callout Boxes to get other ideas on how to have fun with colors, images, and borders.   

                    Click here to go to that page.

 

      • Also, you might be interested in adding Color and Background Images in Cells.  To see how easily this is done, visit All About Cells, or click here.

 

 

 

Quick Video Link>>Table Basics    Quick Video Link>> Tables-Create Columns    Quick Video Link>>Tables-Callout Boxes