How To Make A Rubber Cap

Table of contents:

How To Make A Rubber Cap
How To Make A Rubber Cap

Video: How To Make A Rubber Cap

Video: How To Make A Rubber Cap
Video: Tutorial: Make Your Own Rubber End Cap 2024, May
Anonim

The upper part of the site, which is also called the header, usually reflects the subject of the resource and may contain a navigation bar. If the site header has a certain width, then on the screens of users with different resolutions, this part of the site will look different. In order for the site header to look the same on any screen, it is necessary to make some of its sections stretching or shrinking depending on the size of the screen. Such a rubber cap can be made without fixing its width in pixels.

How to make a rubber cap
How to make a rubber cap

Necessary

have your own website

Instructions

Step 1

To make a rubber cap, first draw it in Photoshop. Then separate 3 parts of the picture: 2 sides and the middle. These pieces should be about 10-20 pixels wide and about the height of the header you want. Save each element so that you have 3 different files: 1.gif, 2.gif, 3.gif. Submit these images to the site.

Step 2

Next, create a table that will hold the elements at the top of the site. To do this, write in the HTML code:

A table with a width of 100% will stretch or shrink depending on the user's screen size.

Step 3

Make a line in the table, in the cell of which place the left side of the 1

Step 4

Create a middle section of the site header consisting of a repeating 2

.header {background-image: url ('images / 2.gif');}

Step 5

Now, in a row of the table, create another cell and place the middle element of the top of the site in it, indicating its name header in the CSS code:

Name of the site

>

Step 6

Having created the third cell in the table row, place the right side of the 3

Name of the site

Recommended: