CSS собственост "прозрачност" - лесен начин да направи сайта по-интересен дизайн

Днес, създаването на уебсайт дизайн става форма на изкуство. Това не е просто набор от елементи на страницата с определен цвят и размер, шрифтове на различни стилове и тематични картини. За да направите вашия сайт различен от другите, за да привлече вниманието на посетителите и да го насочат към определени елементи, които се използват голям брой методи и инструменти. Сред тях има много популярен CSS имот - прозрачност. Тази техника е доста модерен и бляскав, и затова се използва често. Прозрачността може да даде различни предмети страници на сайта - текстовия блок или цялата картина, например. Той също така се постигне по различни начини. Нека ги разгледаме по-долу.

Параметри уточни елементите на прозрачност

Параметри за регулиране на прозрачността на елементи от няколко. Те се използват в зависимост от конкретните цели, както и на браузъра, която е в рамките на "коригира" дизайн. Те включват следните свойства:

• непрозрачност;
• филтриране;
• PNG изображение като фон.

Имоти стойност CSS "прозрачност" са се променили, както следва: колкото по-висока е цифрата, толкова по-ниско е нивото на прозрачност на елемента. Непрозрачността, тя варира от 0 до 1, във филтъра - от 10 до 100. А то се използва за Interet Explorer браузър, както и всички други приложими непрозрачност собственост.

Прозрачност на изображението (промяна)

Нека започнем с опциите, които ще се появят прозрачни, когато преместите елемента чрез плъзгане на мишката.

Нека разгледаме как да се поставят на прозрачността на изображението. CSS предлага две възможности. За да направите това, вие трябва да го регистрирате директно в HTML-документа код, както следва:

1. Укажете пътя към изображението.
2. Ние се определят параметрите на прозрачност, когато курсорът не е така. За да направите това, ние използваме свойствата на поставяне на показалеца и onmouseout, който предвижда стойността на непрозрачност и филтър.

Същите характеристики могат да бъдат предписани в CSS-документ и изходния код, за да добавите препратка към него. Резултатите се оказват едни и същи.

Прозрачността на текста, и блокове

Що се отнася до текста или блок (прозрачен DIV), CSS предлага своя вариант, подобно на създаването на прозрачен изображение, вие трябва да използвате свързан CSS-файл, в който са определени желаните параметри. Можете да отидете и по-прост начин. Когато зададете стил блок стил Разделение или текст р предписват следния HTML-код, за да поставяне на показалеца и onmouseout елементи. И двата варианта работят и произвеждат желания резултат.

постоянна прозрачност

В някои случаи, на прозрачността на даден обект, елемент от дизайна или текста, който искате да зададете на текуща база. В тази ситуация, решението е още по-лесно, отколкото, когато задържите курсора на мишката.

Css елемент за прозрачност ще се определя чрез следното код. В блок стил DIV предпише стойности за фона (например # ff8800), непрозрачността (например, 0.5) и ширината (ширина) и уплътнението (подложка).

За образа на кодовите стойности правят и непрозрачност филтър и укажете пътя до изображението.

RGBA-метод

Има и други варианти за използване на този имот CSS: прозрачност могат да бъдат приложени към основния цвят на който и да е елемент от дизайна. Той използва метод RGBA. Първите три букви означават основните цветове (червено, делене, синьо), а последната - алфа, която определя нивото на прозрачност. Използването RGBA формат предписва прозрачност, това сочи последната цифра. Например, като: фон: RGBA (240,2,33,0.4035).

заключение

По този начин, чрез използване в процеса на работа по дизайна на сайта си прост, но ефективен функция CSS "прозрачността", можете да го направите по-интересен и по-забележима елементи с минимални усилия. Описаните варианти са персонализирани функции за прозрачност ще ви помогнат с това.