Как создать свой сайт бесплатно? Как сделать сайт своими руками? Как заработать в Интернете? Создание сайтов на заказ.

Запрос должен быть не менее 4-х символов.

RSS-лента

Сегодня:        Добавить в Избранное       Написать Автору        Обмен валют        Оплата сервисов

Урок 7. Цвет текста и фона в HTML.

Автор: Андрей Краснокутский

Дата: 2008-12-05

Как задать цвет фона и текста на web-странице?

По умолчанию цвет текста и вообще любого шрифта на web-страницах всегда черный (#000000). Но мы всегда можем задать абсолютно любой цвет, который нам нравится и прилично смотрится или же больше подходит под дизайн конкретного сайта.

Задаем цвет текста

В HTML цвет текста, шрифта, фона и других элеменотов можно задать двумя способами:

1. Способ 1-й. В парных тегах <font> </font> прописывается атрибут <color> с указанием названия нужного цвета. Название цвета указывается по английски. Например, цвет заголовка на нашей web-странице можно задать таким способом:

<font color="red">Красный</font>

Не забываете про правило вложенности тегов. Полный код нашего заголовка будет выглядеть так:

<h2><font color="red"> Обзор автомобилей 2008 года. </font></h2>

А сам заголовок на странице будет выглядеть так:

Обзор автомобилей 2008 года.

2. Второй способ задания нужноо цвета - это прописать цвет его шестнадцатеричным значением в палитре RBG в виде: #RRBBGG, где RR - красный цвет (red), BB - синий (blue) и GG - зеленый (green). Чем выше значение одной из компонент, тем она более интенсивна (насыщена).

Оттенки серого получаются при задании одинаковых значений для всех трех компонент. Каждая компонента может варьироваться от 0 до FF (255), т.е. всего можно получить 256х256х256=16777216 цветов. При указании цвета в шестнадцатеричным значением обязательно ставится знак: # . Полностью код будет выглядеть вот так:

<p><font color="#FF0000"> Текст красного цвета </font></p>

Записи вида:

<p><font color="red"> Текст красного цвета </font></p>

<p><font color="#FF0000"> Текст красного цвета </font></p>

равнозначны и отображаться браузерами будут совершенно одинаково.

Для нашей web-странички, я например шрифт заголовка выделил красным цветом "red", а текст на статьи задал темно-синим, прописав внутри каждого абзаца (p) таким образом:

<p><font color="#000080">Текст абзаца </font></p>

 

Задаем цвет фона web-страницы

Так же как и цвет текста Мы можем изменить и цвет фона нашей страницы.

По умолчанию фон web-страницы всегда задается белый цветом (white или #FFFFFF), но даже если Вы хотите оставить фон страницы белым, его всеравно рекомендуется прописать, потому что не всегда браузеры корректно отображают значения по умолчанию. Делается это через атрибут: bgcolor. Цвет фона на web-странице прописывается внутри тега: body , т.е запись будет выглядеть так:

< body bgcolor="#FFDEAD">

Посмотреть на то, что у нас получилось можно здесь. Если Вам что-то не понятно можно открыть HTML код страницы. В браузере IE это делается через меню: Вид > Просмотр HTML кода, в браузере Opera это меню: Вид > Исходный текст.

В разделе Статьи Вы найдете названия основных цветов и их значения в палитре RBG. Попробуйте применить разные цвета теста, заголовков, фона, но помните: цвет текста и фон страницы выбираются по желанию дизайнера, но нужно учитывать и тот факт, что от них зависит визуальное восприятие всего сайта. Не стремитесь все затемнить, текст удобно читать, если его хорошо видно.

Всего Вам доброго.

Обновлено: 06.10.2014 г.

 

Читайте также:

Электронная книга: Отличный заработок. Бесплатная реклама. Вирусный трафик.

Как создать RSS-канал новостей на сайте?

Практическое руководство: "Учимся делать сайт за 11 уроков"

FlashGet 3.5ru - менеджер загрузок. Скачать бесплатно.

Психология продаж. Как научиться искусству Копирайтинга?

Как заработать в Партнерских Программах. Пять 100-процентных рекомендаций.

 

Просмотров: 24313


Поделитесь этой информацией со своими друзьями!


Комментарии к этой статье (уроку):

Комментарии добавил(а): Олег Гузь
Дата: 2009-10-23

Андрей! Какой у Вас замечательный сайт! Я уже вторую неделю регулярно им пользуюсь: изучаю Ваши уроки, и видеоуроки; читаю Вашу литературу и скачиваю программы; делаю первые шаги в веб-программировании! И, что самое главное, у меня получается!!! А я ведь совсем не физик, а лирик! И в этом может убедиться каждый, кто посетит мой литературный сайт: " СТИХИ ОЛЕГ ГУЗЬ " Мои реквизиты: электронная почта: STIHI100@rambler.ru сайт: http://sites.google.com/site/stihiolegguz/

Комментарии добавил(а): Женя
Дата: 2009-11-09

Я пробовал изменять цвет фона, и у меня не получается! Как изменить цвет фона?

Комментарии добавил(а): Андрей_К
Дата: 2009-11-09

внимательно проверьте код

Комментарии добавил(а): Вова
Дата: 2010-01-09

Я пробовал изменять цвет фона, и у меня не получается! Как изменить цвет фона?

Комментарии добавил(а): Jktu
Дата: 2010-01-10

Вова вам же сказали: <body bgcolor="#FFDEAD">

Комментарии добавил(а): Алексей
Дата: 2011-01-11

Прикольно,всего вам самого хорошего.

Комментарии добавил(а): Bebe
Дата: 2011-01-11

там пробел убрать надо просто..

Комментарии добавил(а): Александр
Дата: 2011-04-05

если цвет задается 16-ричным кодом, то код записывается только через диес (#), если же цвет задается словом, то только в кавычках. Т.О. <body bgcolor=#FFFFFF> не верно: <body bgcolor="WHITE"> или

Комментарии добавил(а): Александр
Дата: 2011-04-05

ой, пардон, там ошибка: Т.О. <body bgcolor="#FFFFFF"> не верно,верно: <body bgcolor="WHITE"> или <body bgcolor=#FFFFFF>

Комментарии добавил(а): Юрий
Дата: 2011-07-30

а как сделатьфон рисунком?

Комментарии добавил(а): Андрей
Дата: 2011-07-31

Как сделать фон из рисунка посмотрите здесь: http://www.luksweb.ru/view_post.php?id=29

Комментарии добавил(а): сергей
Дата: 2011-09-01

скажите а между допустим: <p> <strong> <font color="red"> Нынешний год </font> </strong> - <em> пора обновления </em> обязательно ставить пробелы или можно без них: <p><strong><font color="red">Нынешний год</font></strong>-<em>пора обновления</em>

Комментарии добавил(а): сергей
Дата: 2011-09-01

непонятно нужны ковычки или нет "#FFFFFF" в этом примере <body bgcolor="#FFFFFF">

Комментарии добавил(а): Геннадий Григорьевич
Дата: 2011-12-28

Всё понятно, благодарю.

Комментарии добавил(а): Андрей
Дата: 2012-01-23

Занимался с разными самоучителями,бесполезно я не пробиваем,решил больше не пытаться.Но месяц на этом сайте где всё разжевано и в рот положено осталось только проглотить меня уверил, что все очень просто нужно только понять суть. Огромное спасибо Автору

Комментарии добавил(а): Денчик програмист
Дата: 2013-01-31

Спасиба очень помогли...

Комментарии добавил(а): Серёга
Дата: 2013-03-04

<h2><font color="red"> Обзор автомобилей 2008 года. </font></h2>

Комментарии добавил(а): Серёга
Дата: 2013-03-04

Не получается изменить цвет =(

Комментарии добавил(а): Серёга
Дата: 2013-03-04

<font color="red">Красный</font>

Комментарии добавил(а): Вадим Галялетдинов
Дата: 2015-07-15

Я хочу в Мозилле сделать сейчас текст и фон полностью Цветным и всю страницу цвете!Прокомментировал Вадим Галялетдинов

Добавить Ваш комментарий:

Введите сумму чисел с картинки:
Введите сумму чисел

GudzonPartner.com

Новости сайта


05.08.2014
Новый раздел! Платежные системы Интернета. Все о платежных системах и сервисах.

09.08.2013
Новинка! Обзор и Анализ реальных способов заработка. Как и Сколько можно заработать в Интернете? Цифры. Факты. Комментарии.

28.05.2013
Обновилась Партнерка сайта! Зарабатывайте вместе с нами! "Новые товары и рекламные материалы"

25.05.2013
Видео Курс! "Как создать свой Информационный Бизнес в Интернете" Зарабатывайте: от 30000 ++ рублей.

Почтовая рассылка! Бесплатные электронные книги из серии: "Секреты создания сайтов"


Почтовая рассылка

Новинка!
Как реально заработать
в Интернете?
"Обзор видов и способов заработка."

Специальный Отчет:

Специальный Отчет: Как и сколько можно реально заработать в Интернете? Рельные цифры, факты и анализ различных способ заработка в Интернете

В подарок всем подписчикам!

SmartResponder.ru
Ваш e-mail: *
Ваше имя: *

Полный список наших почтовых рассылок!

Домены

Сервис мгновенной регистрации Доменов

Google Adsense



Навигация

Уроки HTML

CSS уроки

Статьи

Инструменты

Шаблоны сайтов

Книги

Украшения

Сайт от А до Я

Заработать в Интернете

Обман в Интернете

Охрана труда

МОДУЛЬНЫЕ КАРТИНЫ

PHP УРОКИ

Услуги

Скрипты

Почтовая Рассылка

SEO

jQuery

Специальная оценка условий труда (СОУТ) - АРМ

Платежные системы Интернета

УРОКИ ФОТОШОП

Секретный раздел

Видео Курсы

Видео Курс по созданию собственного Информационного Бизнеса в Интернете
Видео Курс по созданию
Информационного Бизнеса в Интернете
Узнать сейчас >>>


Хотите заработать?
2-х Уровневая
Партнерская программа!

Присоединяйтесь.


Последние заметки

Модульная картина: Роскошь красного бархата

Модульная картина абстракция: Энергия солнца

Модульная картина: Синие розы

Модульная картина: Водопад

Модульная картина: Орхидеи

Новости сайта

RSS Лента Новостей сайта www.LuksWeb.ru

Наши новости в Твиттере

Архив

2016 год:

2015 год:

2014 год:

2013 год:

2012 год:

2011 год:

2010 год:

2009 год:

2008 год:

Сайты друзей

Регистрация доменов

ООО "ПК "ЛюксСтрой"

Деревянные дома от СПК "Ванда"

Наши ссылки

Если Вам понравился
наш сайт, установите
Нашу ссылку, и
Получите подарки!!!

QR код сайта www.LuksWeb.ru

Наши Аттестаты


Проверить аттестат

 

Аттестован системой Z-PAYMENT
Проверено Z-PAYMENT