Программирование - это просто
Advertisement
Главная arrow Web-программирование arrow Уроки CSS arrow Уроки web-программирования. CSS (HTML): Фильтры. Croma.
18.04.2024 г.
Главное меню
Главная
Интернет магазин
Программные продукты
Биржевые роботы
Искусственный интеллект
Математика и информатика
1С:Предприятие
Уроки C#
Уроки Delphi
Уроки программирования
Web-программирование
Дизайн и графика
Компьютер для блондинок
Исходники
Статьи
Платный раздел
Рассказы про компьютеры
Хитрости и секреты
Системный подход
Размышления
Наука для чайников
Друзья сайта
Excel-это не сложно
Все о финансах
.
Уроки web-программирования. CSS (HTML): Фильтры. Croma. Печать E-mail
Автор megabax   
06.12.2011 г.
Урок 13. Управление шрифтами в CSS New Page 1

Уроки web-программирования. CSS (HTML): Фильтры. Croma.

Все статьи по CSS.

Это последний урок из серии "Уроки Web-программирования. CSS", публикуемый в бесплатном разделе. Начиная со следующего, публикация уроков будет продолжена в платном разделе. В бесплатном же разделе, возможно, иногда  будут публиковать некоторые статьи, посвященные CSS.

 

Сегодня мы изучим фильтр, который делает определенный цвет прозрачным - chroma. Это цвет можно задать как название цвета (reg, blue, grid, yellow), так и в виде HEX-кода, например вот как в этом примере (#FF0000 соответствует красному цвету):

<html>

    <HEAD>

        <STYLE TYPE="text/css">

            <!--

                .cl1 {

                    filter:chroma(color=#FF0000)}

                }

                div {

                    position:absolute;

                }

            -->

        </STYLE>

    </HEAD>

    <BODY>

        <div>

            <img src="1.jpg">

        </div>

        <div>

            <img src="3.png" class="cl1">

        </div>

    </BODY>

</html>

 

Для тестирования примера первый рисунок (1.jpg) возьмем из урока3  а второй (3.png) пусть будет вот такой:

 

Уроки web-программирования. CSS (HTML): Фильтры. Croma.

Если вы хотите нарисовать подобную картинку самостоятельно, то цвет выбирайте задавая его составляющие числами:

 

Уроки web-программирования. CSS (HTML): Фильтры. Croma.

 

сохраните рисунок в gif или png, но не в коем случае не в jpg и ему подобном: сохранение в сжатом формате хоть и очень незначительно, порой незаметно для глаз, но все же искажает цвета. И такого искажения уже достаточно, что бы фильтр не сработал или сработал коряво, например, так (тут я поставил фильтр по белому цвету, по красному в jpg фильтр не работал вообще):

 

Уроки web-программирования. CSS (HTML): Фильтры. Croma.

Если же вы сохранили картинку в правильно формате то страница может выглядеть так:

Уроки web-программирования. CSS (HTML): Фильтры. Croma.

Все статьи по CSS.

 

Последнее обновление ( 06.12.2011 г. )
 
Пред. »
 
© 2024 Программирование - это просто
Joomla! - свободное программное обеспечение, распространяемое по лицензии GNU/GPL.
Русская локализация © 2005-2008 Joom.Ru - Русский Дом Joomla!
Design by Mamboteam.com | Powered by Mambobanner.de
Я принимаю Яндекс.Деньги