В данной статье мы не будем познавать основы HTML кода и того, как этот язык вообще устроен и как он работает. Нашей задачей будет узнать несколько полезных приемов, которые в любой момент можно использовать на своих сайтах и лендингах. На самом деле, HTML код мы можем использовать, как посредством виджета "HTML текст", так и в виджете обычного текста, в обоих случаях код будет работать.
ВАЖНО: все html теги в данной статье будут написаны с пробелами перед и после треугольной скобки ( < > ), но в визуальном редакторе вы должны убрать эти пробелы.
Итак, начнем. Возьмем простенький экран лендинга с фоновой картинкой, заголовком и второстепенным текстом:
1. Смена цвета фрагмента текста
Допустим у нас есть УТП - "Лучшая пекарня в мире" и мы захотели сменить цвет слова "пекарня". Для этого воспользуемся html-тегом < font > < /font > (без пробелов). Открываем наш виджет с обычным текстом и прописываем вокруг "пекарня" следующее:
ЛУЧШАЯ < font color="cfaf8a" >ПЕКАРНЯ< /font > В МИРЕ
cfaf8a = код цвета, вы можете выбрать любой цвет, его можно получить прямо в настройках того же виджета текста, в строчке "Цвет текста:", подберите нужный и скопируйте код цвета в наш html код.
2. Жирный фрагмент текста
Возьмем наш второстепенный текст и выделим некоторые слова жирным. Идем в соответствующий виджет текста и прописываем следующее:
Вкус, за которым вы будете возвращаться < b >снова и снова< /b >.
Мы прописали тег < b > < /b > и выбранные слова стали немного жирнее обычного, в нашем примере это не сильно заметно, но если текст был бы большего размера, это бы было заметнее. Небольшая оговорка: вы не сможете сделать жирным текст, у которого уже задан стиль Bold в настройках виджета.
3. Подчеркнутый фрагмент текста
Тег < u > < /u > делает текст подчеркнутым. В нашем случае мы просто добавляем этот тег вокруг того, что уже есть:
Вкус, за которым вы будете возвращаться < u >< b >снова и снова< /b >< /u >.
Получаем:
4. Зачеркнутый фрагмент текста
Тег < s >< /s > делает текст зачеркнутым. Актуальный тег, когда необходимо поставить цену по акции, например. Заменим наш второстепенный текст и пропишем следующее:
Цены от < s >60 рублей< /s > 30 рублей за единицу!
Получаем:
5. Размер фрагмента текста
В последнем примере не хватает увеличить размер шрифта в фрагменте "30 рублей". Сделаем это посредством тега < font size >:
Цены от < s >60 рублей< /s > < font size="35" >30 рублей< /font > за единицу!
35 = размер текста.
Получаем:
