Меняем цвет текста и фона. Задаем цвет текста
Дата создния: 2009-11-18
Итак, Вот и пришла пора изучить, как изменяются цвета того текста, который Вы ввели. Этот урок будит состоять из 2 частей . В мы разукрасим отдельную часть текста, а во , весь текст сделаем одного цвета, а необходимую его часть, другого цвета.
1. часть
Хотя все цвета в HTML прописываются необычным способом, делается это очень просто. Во-первых, я предлагаю Вам скачать палитру web-цветов, нажав по слову ПАЛИТРА , или поискать более полную версию в Интернете. Возле каждого цвета в найденной Вами палитре, будет стоять код (английские буквы и цифры). Для того, чтобы наш цвет был, например, синим, необходимо записать такой тег:
Привет! Начинаем изучение HTML
Тоесть вот, что мы имеем:
1.
текст заключен в тег
...
2.
тег
имеет атрибут color (цвет) = #0000FF
Теперь давайте вернёмся к нашему примеру и рассмотрим все наглядно. Снова открываем созданную ранее страничку в блокноте и изменяем цвет шрифта:
Обновляем HTML страницу и проверяем то, что получилось:
Результат: Первая строка стала синего цвета, а вторая осталась по умолчанию - черной.
Таким же образом Вы можете разукрасить любую необходимую часть текста, не зависимо от того, где он расположен, в начале, в середине или в конце текста.
2. часть
Сейчас мы зададим цвет всему тексту документа . Делается это очень легко. Давайте вспомним нашу третью статью. В ней мы говорили, что все, что будит видно в браузере, прописывается в теге ... , тоесть в "туловище" нашего документа.
И так, как мы знаем, ... - тоже тег, поэтому, мы можем ему, так же как и тегу ... , задать необходимые атрибуты.
Цвет в этом случае задается в открывающемся теге , и запись будит выглядеть так:Весь текст вашего документа
В этом случае весь текст документа, кроме того, который заключен в теги ... с присваиванием цвета, будит иметь красный цвет.
Теперь рассмотрим эту часть статьи на примере. Присвоим всему тексту документа красный цвет, а тот текст, который мы в 1 части сделали синим, таким и оставим. Для этого просто прописываем код открывающемуся тегу :
Затем, как всегда перед просмотром, сохраняем документ:
И, наконец, обновляем HTML страницу в браузере:
Результат: Мы научились задавать всему тексту документа необходимый цвет, а так же делать часть текста другого цвета.
Виды заработков через Интернет,
или на что не нужно тратить время
С чего лучше
начинать новичкам.
Где же в Интернете
деньги или стратегия
заработка в сети
Инструкция создания
сайта за 5 минут.
Основы html
и пошаговое
создание сайта
Как стать
веб дизайнером
и научиться
создавать сайты
на высоком уровне.
Как заработать
на своем сайте,
как раскрутить сайт
и получать прибыль
на автопилоте
У вас есть сайт,
но он не приносит
прибыль?
Обзор сервисов
по монетизации
Не знаете куда вложить
деньги,
чтобы получить
прибыль? Это уникальная
информация
О форексе вообще.
Как правильно вложить
свой капитал или
заработок 50$ в день
на автопилоте
Как и где купить домен и хостинг. Как загрузить сайт в интернет
Как перенести домен к другому регистратору, чтобы сэкономить на продлении
Продолжаем освоение html, в третьем уроке нашего обучения мы займемся изучением , а именно изменением цветов на странице. А то как-то тускло все выглядит.
Html код который у нас уже есть:
Содержимое моего сайта.
Сейчас будем учиться изменять на странице. Для того, чтобы указать какого цвета должен быть текст, необходимо проделать следующие действия.
Измените тег
следующим образом: text="#FF0000" > , то есть для изменения html цвета текста, нужно добавить параметр text= и указать его значение "#FF0000".Значение параметра определяет цвет, то есть "#FF0000" – красный цвет. Здесь действует закон трех цветов.
Например, "#00FF00" – зеленый html цвет, "#0000FF" – синий html цвет текста. При смешивании, эти три цвета образуют новые оттенки и html цвета. Например, "#3715FB".
Давайте сделаем так, чтобы текст на нашей странице был красного цвета. Для этого примените полученные знания. В итоге должен получиться мледующий html код:
Содержимое моего сайта.
Я прохожу уроки создания сайта.
(Синим цветом будут выделены новые участки html кода)
Должно получиться следующее > измененный .
Теперь разберемся, как задавать html цвет отдельных фрагментов текста. Если вам нужно чтобы часть текста имела другой html цвет, проделайте следующие действия:
Заключите нужный текст между тегами . Это новый html тег, он является парным.
Затем, введите параметр color= со значением "#00FF00", то есть так color="#00FF00" > текст другого цвета .
Применим знания на нашем html коде и изменим фрагмент текста.
Содержимое моего сайта.
Я прохожу уроки создания сайта.
Должно получиться следующие > меняем .
Цвет фона html
Теперь изменим цвет фона html
, для этого нужно задать в теге
Цвет фона html не обязательно брать "#494949", можно взять любой другой.
Давайте внесем изменения в наш код и изменим цвет фона html.
Содержимое моего сайта.
Я прохожу уроки создания сайта.
Теперь посмотрим, что получилось > изменение
Задача
Изменить цвет текста заголовка и фона под ним.
Решение
Для изменения цвета фона под текстом используется универсальное свойство background , которое следует добавить к селектору h1 . Цвет заголовка меняется с помощью свойства color , которое также добавляется к этому селектору (пример 1).
Пример 1. Цвет фона под заголовком
HTML5 CSS 2.1 IE Cr Op Sa Fx
Закон внешнего мира
Закон внешнего мира методологически выводит интеллигибельный мир, хотя в официозе принято обратное.
Результат данного примера показан на рис. 1.
Рис. 1. Цвет фона под заголовком текста
Учтите, что на размер цветного прямоугольника влияет не только размер текста, но и отступы вокруг него. Поэтому регулируйте размер фона за счет свойства padding , добавляя его опять же к селектору h1 .
В этом уроке мы рассмотрим последний атрибут тега , который задает цвет текста. По умолчанию текст имеет черный цвет, который выводиться на белом фоне. Для того, чтобы изменить цвет текста в html , нужно применить атрибут color тега :
Для задания цвета достаточно указать его название, например: red, green, blue. Рассмотрим небольшой пример:
Текст зеленого цвета
Текст красного цвета
Текст фиолетового цвета
Посмотрим результат в браузере:
Текст в первом абзаце стал зеленым, во втором – красным, а в третьем – фиолетовым. Всего существует 16 названий основных цветов и 130 дополнительных. Полный список цветов вы можете посмотреть в таблице цветов html.
Этот способ обозначения цвета очень прост, но весьма ограничен. Поэтому для того чтобы изменить цвет в html – коде, чаще используют шестнадцатеричное число перед которым стоит знак решетки (#), например:
С помощью такого обозначения можно получить более 16 миллионов цветов и их оттенков! Получить код цвета можно с помощью , который имеется на сайте, или воспользовавшись палитрой цветов в том же Photoshop. Рассмотрим пример и запишем следующий код:
Текст зеленого цвета
Текст красного цвета
Текст фиолетового цвета
Сохраним файл и посмотрим на результат:
Как вы видите, мы задали тексту те же цвета, как и в первом примере, только здесь мы воспользовались шестнадцатеричной системой исчисления или другими словами, мы задали цвет в формате HEX.
Теперь вы научились изменять цвет текста в html и в конце урока предлагаю повторить все атрибуты тега , и задать тексту сразу несколько параметров, а именно: шрифт, размер и цвет. Запишите пример:
Задаем тексту шрифт, размер и цвет
Задаем тексту шрифт, размер и цвет
Цвет шрифта на сайте можно задать при помощи HTML-кода. Для этого существует тег font . По определению, тег font служит некой «обёрткой» или «контейнером» для текста, управляя свойствами которого можно изменять оформление текста.
Тег font применяется следующим образом:
Конструктор сайтов "Нубекс"
Самый простой способ, как изменить цвет шрифта в HTML, это использовать атрибут color тега font :
Конструктор сайтов "Нубекс"
Здесь задается синий цвет для слова, обрамленного тегом font .
Но помимо параметра color, тег имеет и другие атрибуты.
Атрибуты тега FONT
Тег font имеет всего три атрибута:
- color - задает цвет текста;
- size - устанавливает размер текста;
- face - задает семейство шрифтов.
Параметр color может быть определен названием цвета (например, “red”, “blue”, “green”) или шестнадцатеричным кодом (например, #fa8e47).
Атрибут size может принимать значения от 1 до 7 (по умолчанию равен 3, что соответствует 13,5 пунктам для шрифта Times New Roman). Другой вариант задания атрибута - “+1” или “-1”. Это означает, что размер будет изменен относительно базового на 1 больше или меньше, соответственно.
Рассмотрим применение этих атрибутов на нашем примере:
Конструктор сайтов "Нубекс"
Мы применили тег font к одному слову, задали для него размер 6, оранжевый цвет и семейство шрифтов “Serif”.
Задание цвета текста при помощи CSS
Если вам нужно применить определенное форматирование (например, изменить цвет текста) к нескольким участкам текста, то более правильно будет воспользоваться CSS-кодом. Для этого существует атрибут color. Рассмотрим способ его применения на нашем примере:
Конструктор сайтов "Нубекс"
Здесь мы задали синий цвет для слова «Конструктор» (размер его, по умолчанию, 100% от базового), зеленый цвет и размер 125% для слова «сайтов», оранжевый цвет и размер 150% для слова «Нубекс».
