Today, the creation of website design becomes a real art.It is not just a set of pages of a certain color and size, fonts, different styles and theme pictures.In order to make a website different from others, to attract the attention of visitors and send it to those or other elements using a huge number of methods and tools.Among them there is a very popular property css - transparency.This technique is quite fashionable and glamorous, and therefore is used often.You can give the transparency of various objects pages - text, image, or the whole unit, for example.It can also be achieved in different ways.Let us examine them below.
parameters to set the transparency of elements
parameters allowing to adjust the transparency of elements of several.They are used depending on the specific goals, and the browser, which is under the "adjusted" design.These include the following properties:
- opacity;
- filter;
- PNG-image as a background.
property values css "transparency" are changed as follows: the higher the number, the lower the level of transparency of the element.The opacity it varies from 0 to 1, in filter - from 10 to 100. And the latter is used for the browser Interet Explorer, and for all other applicable property is opacity.
Transparency image (changing)
begin with options when transparency will manifest itself when you move the mouse cursor to the item.
consider how to set the transparency of the image.CSS offers two options.To do this, you must register it in code html-document as follows:
- Specify the path to the image.
- defines the parameters of transparency when the cursor is not.For this we use the properties onmouseover and onmouseout, which prescribes the value and opacity filter.
These characteristics can be prescribed in css-document and the source code to add a link to it.The results turn out the same.
transparent text blocks and page
As for the text or block (transparent div), css offers its option, similar to creating a transparent image, that is used connected css-file, which will be given the necessary parameters.You can go and a simpler way.When you set the style block div style or text p prescribe the following html-code elements for onmouseover and onmouseout.Both options work and give the desired result.
Transparency constant
In some cases, the transparency of the object, a design element or text you want to set on an ongoing basis.In this situation, the solution is even simpler than with the mouse.
css element for transparency will be given the following code.In block div style prescribe values for background (e.g., # ff8800), opacity (eg, 0.5) and the width (width) and padding (padding).
for pictures in the code are making values and opacity filter, and specify the path to the image.
RGBA-method
There are other options for using this property css: transparency can be applied to the background color of an element of design.It uses the method of RGBA.The first three letters represent the basic colors (red, fission, blue), and the last - alpha, which sets the level of transparency.Using RGBA-format prescribes transparency, pointing it to the last digit.For example, as: background: rgba (240,2,33,0.4035).
Conclusion
Thus, using in the course of work on the site design is simple but spectacular property css "transparency", you can make it more interesting and more noticeable elements of minimal effort.The described embodiments job performance transparency will help you with this.
