Перейти к содержимому
  • Стили символов и абзацев

       (19 отзывов)

    Евгений Зубов
    • 34 4,25,6,20,3,26,27,28,29 4,6,32 https://creatura.club/uploads/monthly_2015_12/567f05d717ca1_3.5.5.mp4.959be1cbd018cb482df6be3a961dc4af.mp4 10 До 10 минут display: none; https://creatura.club/uploads/ Средняя сложность display: none;
      1. Пройдите тестирование для урока
      2. Оцените урок и сдайте задание

      В этом видеоуроке мы рассмотрим работу со стилями символов и абзацев в программе Adobe Muse. Заходим в программу, у меня уже есть текст текстовый фрейм с надписью muse.digitalmakers.ru и для того, чтобы нам рассмотреть, что же такое стили символов и абзацев, давайте сразу зайдем в меню "Окно" и выберем здесь "Стили абзацев". Появилось окно, которое откреплено, но для удобства его можно прикрепить к меню справа. Здесь есть "Стили символов", "Стили абзацев", "Стили маркеров" и "Стили графики".

      Что такое "Стили символов"? Например, мы заходим в редактирование данного текста и решили изменить какое-то слово, сделать его другим шрифтом, например, жирным и синего цвета. Также изменили ему размер на 48. Далее мы можем зайти в "Стили символов" и нажать на значок "Создать новый стиль на основе примененных атрибутов". При этом у нас выделено слово. Создаем новый стиль, у нас появляется новая запись "Стили символа" , кликаем по нему 2 раза. В настройках стиля сохранилась толщина "Полужирный", размер 48, цвет текста и тег span. Мы можем переименовать стиль в "Жирный синий", нажимаем Ок, и изменяется имя стиля. Дальше я могу выделить любой символ из этих слов, например, выделим букву U  и применим к ней стиль символа. Автоматически буква подхватила стиль символа и стала такой же, как и все остальные буквы.

      Мы можем выделить любые другие буквы и применить к ним также стиль символа. Для того, чтобы отменить применение стиля к данным буквам, нажимаем просто на кнопку "Отменить связь стиля с выделенной областью", тогда наше редактирование останется, а стиль данных букв отменится. Если сейчас создать новый стиль из этих обычных стандартных букв, нажмем снова "Создать новый стиль", зайдем в настройки двойным кликом мыши и нажмем здесь "Стандартный текст". Видим, что здесь размер 36, цвет черный и тег span. Нажмем ОК и у нас есть еще один стиль текста "Стандартный текст". Так вот если я сейчас выделю надпись muse и придам ей стиль текста "Стандартный текст", то она станет такой же, как и все остальные буквы. Если же я выделю muse снова и применю к нему стиль символа "Жирный синий", то эта надпись снова станет такой же, как и в данном стиле символа с настройками данного стиля символа.

      Если же я вдруг захочу изменить данный стиль, например, выделю какую-то букву и изменю цвет на красный, то в стилях символов появится значок + - это означает то, что стиль символа претерпел некоторые изменения. То есть изменения в данном случае касается цвета. Далее можем нажать на кнопку "Переопределить стиль на основе примененных атрибутов", и все те буквы, к которым был применен данный стиль, автоматически изменят свои характеристики в соответствие с тем, как изменился данный стиль. Если же мы сейчас кликнем 2 раза левой кнопкой мыши по нему, то увидим, что данный стиль уже имеет красный цвет. Мы можем переименовать его в "Жирный красный", нажимаем Ок. Вот атаким образом работают "Стили символов".

      Что такое "Стили абзацев"? Создадим новый текстовый фрейм. Зайдем в браузер на сайт fishtext.ru для генерации абзацев. Выделим данный текст и скопируем его в программу. Таким образом есть 2 абзаца текста, которые были сгенерированы на другом сайте. Давайте зададим тексту некоторое форматирование. Идем в "Текст", выравним по правому и левому краю, то есть по ширине данного текстового фрейма. Сделаем некоторый отступ левого поля. Также сделаем абзацы, выделим и сделаем отступ правого поля. То есть мы захотели, чтобы у нас было такое форматирование в данном текстовом блоке. Давайте изменим еще и размер шрифта на 16 сам шрифт Pt Sans. Далее идем в "Стили абзацев", нажимаем кнопку "Создать новый стиль на основе примененных атрибутов". И новый стиль появился. Если мы нажмем на него 2 раза левой кнопкой мыши, то у нас выскакивают настройки стиля абзацев. Здесь сохранился отступ 39, отступ слева-29, выравнивание по ширине, отступ справа - 35, размер текста 16, тег html и шрифт  Pt Sans. Здесь мы можем задать имя данного стиля, назовем его "Простой текст".

      И теперь создадим еще один текстовый фрейм, пускай текст у нас будет точно такой же. Но текст вставится неотформатированный. Поэтому выберем инструмент "Выделение", выделим тестовый фрейм, перейдем в "Стили абзацев", чтобы выбрать "Простой текст". Теперь после одного нажатия кнопки мыши мы отформатировали этот текст точно так же, как и в предыдущем текстовом фрейме. Теперь к данным текстовым фреймам применен стиль абзацев "Простой текст". Если сейчас в одном из них мы захотим внести некоторые изменения, например, шрифт 12, то снова заходим в "Стили абзацев", и видим, что напротив нашего стиля появился +. Стали доступны дополнительные настройки. Нажимаем "Переопределить выбранный стиль на основе примененных атрибутов", и вы видите как при одном клике мышки изменилось форматирование и в обоих текстовых фреймах. Если бы у нас таких текстовых фреймов с текстом было, например штук 10, то одним кликом мышки "Переопределить стиль на основе новых атрибутов" мы бы изменили форматирование всех фреймов, к которымм был применен стиль абзацев "Простой текст".

      Точно так же, как и со "Стилями графики" мы можем "Отменить связь стиля с выделенной областью", и этот стиль абзаца уже не будет воздействовать на другой текст. Например, изменяем снова шрифт у текста на 14, заходим в "Стили абзацев", нажимаем "Переопределить стиль на основе новых атрибутов", то стиль у нас атрибуты поменял, а данный текстовый фрейм каким был, таким и остался, поскольку стиль абзацев "Простой текст " уже на него не воздействует. Мы отвязали данный стиль от текста. Все атрибуты, которые сохраняет стиль, вы можете увидеть, нажав двойным кликом мышки на имени стиля. Тогда у вас выскакивает окно с настройками стиля. Можете посмотреть, какие именно настройки будут применяться к тексту, к которому применен данный стиль. Вы видите, что для стилей абзацев это в основном абзацный отступ, выравнивание, шрифт, размер шрифта и тег абзаца. А для стилей символов это в основном толщина символа, размер символа, цвет и тег. Здесь уже речь о каких-то отступах не идет.

      И еще один момент: если вы, например, вдруг изменили текст (размер шрифта, сам шрифт), к которому применен стиль , и вам не понравились новые изменения, то вам нужно зайти снова в "Стили абзацев" к тому стилю, который применен к данному тексту. У него появляется +, а чтобы отменить изменения, нужно нажать на Отменить дополнительную настройку стиля. Таким образом вы возвращаете стилюпредыдущие настройки форматирования. Также вы можете удалить не понравившийся вам сталь, при этом необходимо будет выбрать, на какой стиль вы хотите изменить удаляемый стиль. Теперь вы видите, что стиль, который я сейчас удалил, перешел к первоначальному состоянию. Таким образом, применяя стили символов и стили абзацев у себя на сайте, вы можете обеспечить себе  согласованность всех страниц на веб-сайте и повысить свою продуктивность при помощи создания новых стилей и использования их при создании сайтов на своих веб-страницах. На этом урок закончен. Вам необходимо будет выполнить задание к данному уроку, ответить на вопросы и перейти к следующему уроку.

    Узнаете что такое стили текста. Увидите разницу между стилями символа и стилем абзаца. Узнаете в каких случаях применять разные стили. Попробуете использовать стили на своем сайте. 


      Жалоба


    Отзывы пользователей


    Слава Баранов

    Все понятно

    Поделиться отзывом


    Ссылка на отзыв
    Даниил Князев

    Все понятно, спасибо.

    Поделиться отзывом


    Ссылка на отзыв
    Genka

    +

    Поделиться отзывом


    Ссылка на отзыв
    Гость Падалко Сергей

    Очень продуктивный урок

    Поделиться отзывом


    Ссылка на отзыв
    Юлия+Коваль

    +1

    Поделиться отзывом


    Ссылка на отзыв
    Дмитрий Жуков

    Просмотрено.

    Поделиться отзывом


    Ссылка на отзыв
    Zhanibek_jez

    понятно

    Поделиться отзывом


    Ссылка на отзыв
    Алексей

    Грамотно.

    Поделиться отзывом


    Ссылка на отзыв
    Андрей А

    Все понятно.

    Поделиться отзывом


    Ссылка на отзыв
    Валерий1234

    Спасибо

    Поделиться отзывом


    Ссылка на отзыв
    Aspirantmiha

    5 баллов!

    Поделиться отзывом


    Ссылка на отзыв
    Sharovich

    Спасибо. Всё понятно. Очень полезная функция. Это очень сильно облегчит жизнь.

    Поделиться отзывом


    Ссылка на отзыв
    YanaZamkova

    Какая классная штука - эти стили!! был неудачный опыт по неопытности)) замены шрифта в лендинге. До 4 утра исправляла) а со стилем можно исправить все за секунду. супер!)

    Поделиться отзывом


    Ссылка на отзыв
    gladir1

    Все понятно.

    Поделиться отзывом


    Ссылка на отзыв
    7dgoni6

    Всё понятно.

    Поделиться отзывом


    Ссылка на отзыв
    MB

    Ok

    Поделиться отзывом


    Ссылка на отзыв
    zse777

    Благодарю за отличный урок!

    Поделиться отзывом


    Ссылка на отзыв

×