Совет 1: Как сделать обводку текста

Существуют разные способы привлечь внимание читателя к определенной части текста. Один из этих способов – сделать обводку. С помощью программы Photoshop эту задачу можно выполнить несколькими способами.
Как сделать обводку текста
Вам понадобится
  • - Программа Photoshop.
Инструкция
1
При помощи команды "New" («Новый») из меню "File" («Файл») создайте новый документ в программе Photoshop. Можете сделать то же действие, используя сочетание клавиш "Ctrl"+"N". В палитре «Инструменты» выберите инструмент "Horizontal Type Tool" («Горизонтальный текст»). Поместите указатель курсора на созданный документ, щелкните левой кнопкой мыши в нужном месте и напишите текст. Переведите написанный текст в растр. Для этого щелкните правой кнопкой мыши по текстовому слою в палитре "Layers" («Слои») и выберите опцию "Rasterize Type" («Растрировать текст»).Выполните обводку текста. Для этого воспользуйтесь командой "Stroke" («Обводка») из меню "Edit" («Редактирование»). В открывшемся окне настроек выберите ширину обводки в пикселях, цвет обводки и ее расположение: внутри обводимого контура, по центру или снаружи контура. Нажмите кнопку "ОК". Сохраните созданный документ при помощи команды "Save" («Сохранить») в меню "File" («Файл»).
2
Другой способ создания обводки дает возможность не переводить текст в растр. Иначе говоря, вы сможете редактировать текст с обводкой, созданной как стиль слоя. Для этого создайте слой с текстом, воспользовавшись инструментом «Горизонтальный текст».Кликните правой кнопкой мыши по текстовому слою и выберите опцию "Blending Options" («Опции наложения»). Поставьте галочку в чекбоксе "Stroke" («Обводка»). Кликните по этой вкладке левой кнопкой мыши. В открывшейся вкладке настроек выберите ширину обводки в пикселях. Этот параметр можно настроить, вводя чистовые значения в поле "Size" («Размер»), или передвигая ползунок. Из раскрывающихся списков выберите позицию обводки и режим наложения. В раскрывающемся списке "Fill Type" («Тип заливки») выберите, чем будет заполняться обводка: цветом, градиентом или текстурой. В открывшейся палитре настройте цвет, градиент или текстуру для обводки. Результат изменения параметров будет отображаться в документе, который вы создали. Нажмите кнопку "ОК".Сохраните текст с обводкой при помощи команды "Save" («Сохранить») в меню "File" («Файл»).
Ваши деньги должны работать на вас!
вклад на выгодных условиях
Стабильный доход и уверенность в завтрашнем дне - это то, что вы получите, сделав вклад на самых выгодных для себя условиях.
Возможность вернуть до 260 000 рублей
Если вы решили взять ипотеку
Каждый россиянин имеет право вернуть часть уплаченных налогов за покупку жилья.
Карта с большими бонусами
Дебетовая карта
Возвращается до 10% от стоимости покупок. Выгодна при крупных тратах.
Настроить автоплатежи просто
настройка автоплатежей за пару минут
В мобильном приложении Сбербанка все ваши платежи будут происходить в срок и без вашего участия.
Источники:
  • Обводка текста в Photoshop

Совет 2: Как сделать раскрывающийся текст

Размещение скрытых блоков текста улучшает визуальное восприятие страницы веб-сайта - она загружается в браузер именно в том виде, который разработал дизайнер, независимо от размещенного объема информации. Кроме того, это удобнее посетителю - в поисках нужного блока информации ему не приходится просматривать весь массив, а только лишь небольшие «верхушки айсбергов».
Как сделать раскрывающийся текст
Вам понадобится
  • Базовые знания языков HTML и JavaScript.
Инструкция
1
Используйте пользовательскую функцию на языке JavaScript, чтобы организовать в HTML-странице сокрытие и отображение нужных блоков текста. Общая для всех блоков функция намного удобнее, чем добавление кода к каждому из них по отдельности. В заголовочную часть исходного кода страницы поместите открывающий и закрывающий теги script, а между ними создайте пустую пока функцию с названием, например, swap и одним обязательным входным параметром id:<script>function swap(id) {}</script>
2
Добавьте две строки JavaScript-кода в тело функции - между фигурными скобками. Первая строка должна считывать текущее состояние блока текста - включена его видимость или выключена. Таких блоков в документе может быть несколько, поэтому каждый должен иметь собственный идентификатор - именно его функция получает в качестве единственного входного параметра id. По этому идентификатору она и разыскивает в документе нужный блок, присваивая значение видимости/невидимости (состояние свойства display) переменной sDisplay:sDisplay = document.getElementById(id).style.display;
3
Вторая строка должна менять свойство display нужного блока текста на противоположное - скрывать, если текст видим, и отображать, если скрыт. Это можно делать таким кодом:document.getElementById(id).style.display = sDisplay == 'none' ? '' : 'none';
4
Поместите в заголовочную часть еще и такое описание стилей:<style type="text/css">a {cursor: pointer}</style>Оно понадобится для правильного отображения указателя мыши при наведении курсора на неполный тег ссылки. С помощью таких ссылок вы организуете в странице переключение видимости/невидимости текстовых блоков.
5
Разместите в тексте эти ссылки-переключатели перед каждым скрытым блоком, а в блоки - в конце текста - добавьте аналогичную ссылку. Невидимый текст заключите в теги span, у которых в атрибутах style задана невидимость. Например:Раскройте текст <a onclick="swap('hiddenTxt')">+++</a> <span id="hiddenTxt" style="display: none">Это скрытый текст <a onclick="swap('hiddenTxt')">---</a></span>В этом образце щелчок по ссылке из трех плюсов будет вызывать описанную выше функцию по событию onClick, передавая ей идентификатор блока, который нужно сделать видимым. А внутрь блока помещена ссылка из трех минусов с такими же функциями - щелчок по ней будет скрывать текст.
6
Создайте нужное количество текстовых блоков, аналогичных описанному в предыдущем шаге, не забывая при этом менять идентификаторы в атрибуте id тега span и в переменной, передаваемой функции по событию onClick в двух ссылках.
Поиск
Совет полезен?
Добавить комментарий к статье
Осталось символов: 500