Как заменить цвет на прозрачный. Прозрачный цвет и фон в CSS
Краткая демонстрация
смещения под ползунком регулировки прозрачности.
Примечание: в PowerPoint можно сделать изображение прозрачным и использовать его в качестве фона для слайда.
Установить прозрачный цвет недоступен.
Важно:
Сброс параметров рисунка в группе изменить .
Примечание:
Изменение прозрачности фигуры
Удаление фона рисунка
Изменение прозрачности изображения вне Office
Чтобы сделать рисунок прозрачным, выполните следующие действия:
НаРисовать фигуру, заполнив ее изображением, а затем настройте прозрачность рисунка.
Этот процесс показан в видео. Чтобы просмотреть более подробные сведения о нем и других методах, щелкните заголовок ниже, чтобы развернуть нужный раздел .
Краткая демонстрация
Настройка прозрачности: подробные инструкции
Изменение прозрачности всего изображения
НаРисовать фигуру, заполнив ее изображением, а затем настройте прозрачность рисунка.
Совет: если изменить исходные пропорции фигуры путем перетаскивания, рисунок, вставленный в фигуру, может исказиться. Кроме того, некоторые рисунки плохо подходят для вставки в определенные фигуры. Вы можете настроить внешний вид рисунка, изменив размеры фигуры или использовав параметры смещения над ползунком регулировки прозрачности.
Изменение прозрачности части рисунка
С помощью встроенной функции прозрачности можно сделать один цвет на рисунке прозрачным.
В отличие от применения прозрачности ко всему рисунку, сделать один цвет прозрачным можно только в объекте, вставленном как рисунок (то есть не в рисунке в фигуре). Если рисунок вставлен в фигуру, как описано выше, параметр Установить прозрачный цвет недоступен.
Важно: область, кажущаяся одноцветной (например, зеленые листья), на самом деле может включать в себя целый диапазон близких цветовых оттенков, поэтому можно не достичь нужного эффекта. Применять прозрачные цвета лучше всего в случае с простыми картинками со сплошными цветами.
На рисунке ниже листья состоят из нескольких оттенков зеленого, поэтому только часть листья становится прозрачной, что затрудняет отображение прозрачного эффекта. Повторяющийся процесс с другим цветом удалит прозрачность из первого цвета. Чтобы отменить изменения цвета, нажмите кнопку Сброс параметров рисунка в группе изменить .
Примечание: При печати прозрачные области рисунков имеют тот же цвет, что и бумага. На экране или веб-сайте прозрачные области имеют тот же цвет, что и фон.
Добавление подложки с рисунком
Изменение прозрачности фигуры
Удаление фона рисунка
Изменение прозрачности изображения вне Office 2010
Если у вас есть приложение для редактирования изображений, вы можете использовать его, чтобы сделать рисунок прозрачным. Затем сохраните рисунок в формате, в котором сохраняются сведения о прозрачности (например, PNG-файл), и вставьте его в документ Office.
Настройка прозрачности рисунка: основные шаги
Чтобы сделать рисунок прозрачным, выполните следующие действия:
Сначала наРисовать фигуру
Залейте ее рисунком.
Настройте прозрачность рисунка.
Настройка прозрачности: подробные инструкции
Изменение прозрачности всего изображения
Вставьте изображение внутрь фигуры нужного размера, а затем настройте его прозрачность.
Изменение прозрачности части рисунка
С помощью встроенной функции прозрачности можно сделать один цвет на рисунке прозрачным.
Важно: область, кажущаяся одноцветной (например, зеленые листья), на самом деле может включать в себя целый диапазон близких цветовых оттенков, поэтому можно не достичь нужного эффекта. Применять прозрачные цвета лучше всего в случае с простыми картинками со сплошными цветами.
Добавление подложки с рисунком
Изменение прозрачности фигуры
Изменение прозрачности изображения вне Office 2007
Если у вас есть приложение для редактирования изображений, вы можете использовать его, чтобы сделать рисунок прозрачным. Затем сохраните рисунок в формате, в котором сохраняются сведения о прозрачности (например, PNG-файл), и вставьте его в документ Office.
Изменение прозрачности части рисунка
На вкладке Формат рисунка нажмите кнопку Цвет , а затем щелкните Установить прозрачный цвет .
Примечание:
Изменение прозрачности рисунка или цвета заливки
Изменение прозрачности части рисунка
Один цвет в рисунке можно сделать прозрачным, чтобы скрыть часть рисунка или создать многослойный эффект. Прозрачные области совпадают по цвету с бумагой, на которой они напечатаны. При электронном отображении, например на веб-страницах, прозрачные области имеют цвет фона.
Выберите рисунок, для которого требуется изменить прозрачность цвета.
На вкладке Формат рисунка нажмите кнопку Перекрасить , а затем щелкните Установить прозрачный цвет .
Щелкните область рисунка или изображения, закрашенную тем цветом, который требуется сделать прозрачным.
Примечание: Вы не можете сделать более одного цвета рисунка прозрачным. Области, которые представляют собой один цвет (например, сине-Небесный), в действительности могут состоять из разнообразных вариаций цвета. Таким образом, выбранный цвет может отображаться только в маленьком районе, и в некоторых рисунках может возникнуть трудная возможность увидеть эффект прозрачности.
Microsoft Word – это текстовый редактор и для работы с изображениями здесь не так уж много функций. Добавленную в документ картинку можно обрезать, повернуть, изменить резкость и яркость. А вот что касается прозрачности, то здесь нужно немного постараться, поскольку сразу ее изменить не получится.
В данной статье мы разберемся, как можно сделать прозрачный рисунок в Ворде 2007, 2010 и его более новых версиях, 2013 и 2016. Это может потребоваться, если Вы хотите написать на изображении нем какой-нибудь текст, или сделать его фоном страницы.
Итак, будем использовать в качестве примера вот такой рисунок.
Поскольку изменить прозрачность картинки вставленной в документ напрямую не получится, то сначала нужно нарисовать на листе фигуру, в нашем случае прямоугольник, залить его изображением и потом уже делать прозрачным.
Перейдите на вкладку «Вставка» , кликните по пункту «Фигуры» и выберите из выпадающего списка «Прямоугольник» .
Затем нарисуйте прямоугольник на листе. Лучше рисовать его поверх нужного нам изображения, чтобы сохранились пропорции сторон.
Сместите его вниз, чтобы он не перекрывал картинку.
Кликните правой кнопкой по нарисованной фигурке и выберите из контекстного меню пункт .
Откроется окно «Формат рисунка» . В нем перейдите на вкладку «Заливка» и поставьте маркер в поле «Рисунок или текстура» . Потом нажмите на кнопку «Файл» .
Найдите на компьютере тот файл, которое в документе Ворд нужно сделать прозрачным, выделите его и нажмите «Вставить» .
Если документ создавали не Вы, и картинки на Вашем компьютере нет, тогда можно сохранить изображение на компьютер из документа Ворд .
После этого, нужный графический файл будет добавлен в нарисованный прямоугольник. Теперь, чтобы сделать прозрачный фон, достаточно изменять положение ползунка в поле «Прозрачность» . Можно также сразу смотреть, как меняется вид изображения.
В нарисованном прямоугольнике будут границы. Если они не нужны, перейдите на вкладку «Цвет линии» и отметьте маркером пункт «Нет линий» .
Закройте окно «Формат рисунка» , нажав на соответствующую кнопку.
В результате мы получим две картинки, одна обычная, а вторая полупрозрачная. Можете удалить первую и переместить на ее место прозрачную.
Если у Вас установлен Ворд 2013 или 2016, тогда все действия практически такие же. В фигурах выберите прямоугольник и нарисуйте его поверх того изображения, которое нужно сделать прозрачным.
Переместите его немного ниже, кликните по нему правой кнопкой мыши и выберите из списка .
Справа откроется блок «Формат рисунка» . В нем нажмите вверху по ведерку с краской, разверните меню «Заливка» и отметьте маркером «Рисунок или текстура» . В качестве заливки для нашего прямоугольника нужно выбрать требуемое изображение. Поэтому нажмите «Файл» .
Найдите картинку на компьютере, выделите ее и нажмите «Вставить» .
Когда изображение будет добавлено в Word, чтобы сделать нужный фон достаточно перетащить ползунок в поле «Прозрачность» на подходящее значение.
Если линия вокруг картинки не нужна, разверните меню «Линия» и поставьте маркер в поле «Нет линий» .
Область «Формат рисунка» можете закрывать.
Описанным выше способом, можно менять прозрачность фигуры любой формы. Для этого в «Фигурах» выберите не прямоугольник, а любую другую. Потом залейте его подходящим рисунком.
Также в Ворд можно изменить прозрачность не всего рисунка, а только отдельных областей. Выделите объект, перейдите на вкладку «Работа с рисунками» – «Формат» , нажмите на кнопку «Цвет» и выберите из открывшегося списка .
После этого курсор примет вид палочки с уголком на кончике. Кликните им по тому цвету на картинке, который нужно сделать прозрачным.
Области на картинке, с выбранным цветом станут такими, как вам надо. В примере они белого цвета. Это потому, что лист белый. Если у Вас будет выбран фон страницы другого цвета, то и прозрачные области на изображении станут этого же цвета.
Таким способом можно убрать только один цвет на изображении, и заменить его на прозрачность. Поэтому его лучше использовать, если на картинке есть области одинакового цвета. Если на там есть различные оттенки одного цвета, то полностью сделать, например, синий цвет так как нужно не получится.
Как задать в css прозрачный цвет? На текущий момент для этого есть 3 способа.
Способ 1 — значение transparent
Если вы зададите в качестве значения цвету текста или фона значение transparent , то цвет будет полностью прозрачным, то есть невидимым. Пример:
Color: transparent;
Такой текст нельзя будет увидеть на странице.
Способ 2 — цветовой режим rgba
А это уже нововведение css3. Ранее в веб-разработке такого режима не было, был только rgb. Наверняка вы знаете, как записывать цвет в этом формате. Для этого вам нужно в скобках указать три значения от 0 до 255, указывающие на насыщенность одного из трех основных цветов (красный, зеленый, синий). Например:
Background: rgb(230, 121, 156);
Формат rgba ничем не отличается, только добавляется четвертое значение — степень прозрачности элемента от 0 до 1. Вообще этот формат записи в основном используют, чтобы задать полупрозрачный цвет, а не полностью прозрачный. Чтобы достичь полной прозрачности, нужно всего лишь в качестве четвертого значения написать 0.
Background: rgba(0, 0, 0, 0);
В таком случае остальные 3 цифры особой роли не играют.
Полупрозрачный же цвет можно задать, если в качестве четвертого параметра задать значение от 0.01 до 0.99. О уже писал немного о задании полупрозрачности фону в , можете ознакомиться, если интересно.
Способ 3 — opacity
Еще одно свойство из технологии css3. Но я хочу вас сразу предупредить, что оно работает немного по-другому. С помощью opacity прозрачность задается всему блоку, к которому оно применяется. Таким образом, ухудшается читабельность текста и восприятие картинок. Так что свойство я вижу смысл применять только для блоков, в которых нет текста и какой-то иной информации. Значения можно задавать от 0 до 1, как и в случае с четвертым параметром при задании цвета в формате rgba .
В общем-то, на данный момент это все известные мне способы задания прозрачного цвета в css. Зачем это нужно, это уже другой вопрос. Через прозрачный фон может быть видно то, что находится под ним. Иногда так нужно сделать по дизайну. В целом, прием с полупрозрачностью сегодня очень распространен.
Прозрачный фон (background)
Как вы возможно знаете, background – это css-свойство, которое позволяет задать цвет фона или загрузить изображение, которое будет выступать в качестве фонового.
Задаем прозрачность у css background
Итак, все это делается очень просто благодаря такому формату записи цвета, как rgba . Если вы работаете с графическими редакторами, то наверняка знаете, что цветовой режим rgb расшифровывается так: доля красного цвета (red), доля зеленого (green) и синего (blue). Так вот, rgba практически тоже самое, только добавляется еще один параметр – прозрачность. Записывается так:
Background-color: rgba(173, 57, 22, 0.5)
Сначала мы явно указываем, что задаем цвет в режиме rgba. Потом указываем значения насыщенности трех основных цветов от 0 до 255, где 255 – наибольшая насыщенность. Четвертый параметр это и есть наша прозрачность. Здесь пишется значение от 0 до единицы. 1 – полностью непрозрачный элемент, а 0 – полностью прозрачный. Соответственно, если выставить 0, то фонового цвета не будет видно вообще.
Теперь вы знаете, как в css у свойства background задать прозрачность. Для этого нужно использовать цветовой режим rgba. Есть еще свойство opacity , но оно применяется ко всему элементу в целом. То есть при применении opacity прозрачность может примениться и к тексту, что сделает его нечитаемым.
Прозрачный фон на примере
Преимущества полупрозрачного фона легко показать на примере. Например, у нас есть общий фон страницы. Вот так бы выглядел блок, если бы ему был задан сплошной черный цвет:
А теперь зададим этот же черный цвет блоку, но укажем его с помощью цветового формата rgba, указав последнее значение в 0.7, например. Получится так:
Теперь фон блока просвечивается и через него видно фоновую картинку. Данная картинка и фон приведены лишь для примера. Как вы понимаете, в css background прозрачность может пригодиться, когда вам надо, чтобы фон вложенного элемента просвечивался, не закрывая другие фоны, расположенные в других слоях.
Сам цвет задавать с помощью rgba не сложно. Как уже и говорилось — первые три буквы означают три основных цвета: красный, зеленый и синий, а точнее их долю (от 0 до 255). Прописывая разные значения можно получать миллионы разных цветов, а полупрозрачность позволит вам придумать еще массу красивых эффектов для сайта, если это нужно будет.
Наверное, каждому пользователю персонального компьютера время от времени приходится сталкиваться с необходимостью работы с фотографиями или картинками. Конечно, на ПК продвинутых пользователей наверняка стоит знаменитый Photoshop, в котором можно проделать любую манипуляцию с изображением. Но что делать тем, у кого этой программы нет или кто не умеет ею пользоваться? Самый простой выход из создавшейся ситуации - это воспользоваться стандартным Paint. Он в некоторых случаях может с успехом заменять более профессиональные и сложные программы. В данной статье вы найдете ответы на вопросы о том, в Paint, убрать или изменить его на другой.
Простой способ изменения фона
Опишем, как поменять фон в Paint методом гринскрининга (то есть метод «зеленого экрана»). Независимо от того, требуется вам удаление фона изображения или замена его на сплошную заливку (узор), сделать это можно используя вышеупомянутый метод. Обратим внимание, что в нем описывается изменение фона не в стандартном Paint, а в Paint.NET, который не поставляется со стандартными приложениями, и его необходимо скачать и установить отдельно.
Начало работы
Перед тем как в программе Paint Windows 7 прозрачный фон поменять, следует открыть изображение, которое будете корректировать. Делается это путем нажатия правой клавиши на файле и выбора в выпадающем меню соответствующего пункта (Открыть с помощью - Paint). Следует учитывать, что к числу совместимых форматов относятся BMP, JPFG и GIF, с другими поработать не получится.
В том случае, если изображение превышает необходимо перейти в левый нижний угол и сделать 800-процентное увеличение, кликнув на увеличительное стекло, размещенное на инструментальной панели и выбрав цифру 8.
Выбор цветовой палитры и прорисовка контура изображения
На цветовой палитре следует сделать выбор желто-зеленого (также называемого лаймовым) цвета. Обычно выбирают именно его, поскольку необходим контрастный по отношению к остальному рисунку окрас, а выбранный тон встречается в изображениях довольно редко.
После этого при помощи инструмента «Линия» производится выделение объекта, который будет вырезаться. В том случае, если изображение размещено на белом фоне, для закрашивания недостающих пикселей можно воспользоваться «Карандашом». Благодаря этому вокруг картинки появится широкая линия зеленого цвета.
Далее необходимо щелкнуть на лаймовом цвете правой клавишей мыши и, воспользовавшись инструментом «Выбрать», очертить области фона прямоугольного цвета. Делать это следует аккуратно, стараясь не заходить на объект. Об остающихся вокруг лишних треугольниках особо волноваться не стоит, они убираются позже при помощи инструмента «Ластик». Активировав его, необходимо выбрать самый маленький из возможных квадратиков в появившемся меню.
После всех манипуляций получается объект, вокруг которого будет зеленый экран. Если вас интересует, как изменить фон в Paint, то необходимо отдалить изображение до 100 процентов (1 в меню приближения) и кликнуть по ведру с краской на панели (инструмент «Заливка цветом»). Затем в палитре следует выбрать желаемый цвет и щелкнуть в любом месте зеленого фона. После этого фон станет другим.
Перемещение изображения на новый фон
Для того чтобы выполнить перемещение изображения на другой фон, требуется в палитре выбрать белый цвет и при помощи инструмента «Заливка» закрасить весь лаймовый фон. После этого нажимается комбинация клавиш «Ctrl+A» - и на всплывшей активируется вторая (нижняя) кнопка. Убедившись в том, что новый фон открылся в другом окне программы, необходимо скопировать изображение (комбинация клавиш Ctrl+C) и вставить его в это второе окно (комбинация клавиш Ctrl+V). Работа готова! Остается ее только сохранить.
Несколько нюансов
При редактировании детализированных изображений работать будет значительно легче, если приблизить изображение. Сделать это можно, выбрав в меню «Вид» подпункт «Масштаб» или же просто нажав кнопку «Увеличение», расположенную на ленте.
Следует учитывать, что большие размеры изображения потребуют больше времени на обводку. Для уменьшения размера картинки необходимо нажать «Ctrl+A» и перетащить расположенный слева внизу маркер вверх. Важно при этом соблюдать пропорции, чтобы изображение не получилось искаженным.
В процессе работы неизбежно будут возникать ошибки, и потому придется осуществлять редактирование линии. Для того чтобы иметь возможность быстро отменять предыдущие действия, рекомендуется постоянно держать пальцы на сочетании клавиш «Ctrl+Z».
Если изображение имеет границу в виде кривой, целесообразно воспользоваться инструментом «Кривая». Для этого следует щелкнуть соответствующую клавишу на панели инструментов, начертить от начала до конца участка границы прямую линию, которую затем нужно оттянуть влево или вправо, описывая кривую.
Для того чтобы метод гринскриннинга работал, в Paint Winwows 7 прозрачный фон должен быть установлен в настройках для вставок. Если не выставить эту настройку, то фон будет добавляться из первоначального изображения. Панель управления настройками вставки будет появляться с левой стороны от редактируемого изображения, ниже главной панели, когда используется один из инструментов выбора.
Удаление фона
Если возникает необходимость переноса какого-либо объекта на другой фон, то неизбежно приходится сталкиваться с вопросом о том, как в Paint убрать фон. Делается это весьма просто:
- при помощи инструмента «Волшебная палочка» производится выделение фона;
- выделенная часть удаляется при помощи кнопки Delete или команды «Очистить выделенное» из меню «Правка», в результате этого появляется фон в виде «шахматной доски», условно показывающий прозрачность;
- выполняется сохранение полученного изображения (желательно в либо GIF), которое в дальнейшем можно использовать по своему усмотрению.
Пошаговая инструкция в Paint: как сделать прозрачный фон
Шаг первый . В меню «Файл» следует выбрать пункт «Открыть» и, нажав «Обзор», открыть желаемую картинку.
Шаг второй. Перед тем как сделать Paint, в панели инструментов необходимо выбрать «Волшебную палочку» и установить для нее чувствительность на уровне 50 процентов. При сложных фонах чувствительность нужно выставлять на уровне 25-40 процентов.
Шаг третий. Надо кликнуть «Волшебной палочкой» по белому фону, который после этого превращается в бледно-голубой.
Шаг четвертый. Необходимо удалить выделенный таким образом фон клавишей Delete на клавиатуре или через меню «Правка» - пункт «Очистить выделение».
В результате этого фон станет прозрачным, хотя в Paint он будет иметь шахматную окраску. Однако на этом работа над тем, как сделать прозрачный фон в Paint, не заканчивается.
Шаг шестой . Полученную картинку с прозрачным фоном необходимо сохранить, выбрав в меню «Файл» пункт «Сохранить» и указав имя файла, а в выпадающем списке выбрав необходимый формат (PNG или GIF).
Заключение
Мы рассмотрели, как сделать прозрачный фон в Paint, если под рукой нет Фотошопа. Несмотря на кажущуюся сложность, справиться с этим смогут даже неопытные пользователи. При должном внимании и аккуратности результат ничем не будет уступать работам, выполненным в Photoshop.
В некоторых случаях, например, при оформлении сайта можно столкнуться с ситуацией, когда фон изображения никоим образом не сочетается с цветом самого сайта. Очевидное решение – сделать этот фон прозрачным.
