Цвет фона | htmlbook.ru
Цвет фона является достаточно важным элементом любой веб-страницы. Во-первых, он задает нужное настроение и общий настрой сайта, а во-вторых, облегчает восприятие текста.
Цвет фона веб-страницы задается с использованием атрибута bgcolor тега <body>.
Пример 1. Изменение цвета фона
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Цвет фона</title> </head> <body bgcolor="#c0c0c0"> <p>...</p> </body> </html>
Цвет можно указывать в шестнадцатеричном значении или по его имени.
Несмотря на то, что для фона можно указывать любой цвет, на большинстве сайтов используются преимущественно белый фон и черные буквы, как наиболее устоявшийся вариант.
Фоновый рисунок
В качестве фона можно использовать любое подходящее для этого изображение.
Пример 2. Добавление фонового рисунка
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Фоновый рисунок</title> </head> <body background="images/bg.jpg"> <p>...</p> </body> </html>
Если изображение меньше размера экрана монитора, оно будет размножено по горизонтали и вертикали.
Поскольку фоновый рисунок загружается медленнее, чем цвет фона,
может получиться, что текст не будет читаться некоторое время, пока
не произойдет загрузка рисунков.
Пример 3. Использование фонового рисунка и цвета фона
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Цвет фона</title> </head> <body bgcolor="#c0c0c0" background="images/bg.jpg"> <p>...</p> </body> </html>
Фиксированный фон
По умолчанию, при использовании полосы прокрутки, фоновый рисунок перемещается вместе с содержимым веб-страницы. Internet Explorer позволяет сделать фон неподвижным с помощью атрибута bgproperties=»fixed» тега <body>.
Пример 4. Задание фиксированного фона
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Фон</title> </head> <body bgcolor="#c0c0c0" background="images/bg.jpg" bgproperties="fixed"> <p>...</p> </body> </html>
w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Фон</title>
</head>
<body bgcolor="#c0c0c0" background="images/bg.jpg"
bgproperties="fixed">
<p>...</p>
</body>
</html>При указании атрибута bgproperties, как показано в примере 4, фоновый рисунок на веб-странице будет оставаться неподвижным, а текст, рисунки и другие элементы станут перемещаться вместе с полосой прокрутки.
цветфон
Как задавать цвет фона HTML документа
В уроке Основы HTML мы рассмотрели самые главные html теги, которые являются обязательными и присутствуют в любом html документе.
В данном уроке мы рассмотрим, как с помощью одного из этих тегов задать цвет фона html документа.
Материалы по теме:
- 4 подхода к созданию фона HTML страницы
- Как вставлять картинки и производить их позиционирование в html
- Как сделать ссылку в HTML — виды ссылок — изображение ссылка
Вероятно, вы уже не раз видели, что цвет фона на html страничках не всегда бывает белым.
Белый цвет это цвет фона, который устанавливается браузером по умолчанию, если не указан какой ни, будь другой цвет.
Цвет фона всего html документа, задается в теге <body>. Теперь сделаем фон нашего документа, например желтым. Для этого в теге <body> необходимо прописать атрибут bgcolor=»#FFFF99″. Прописывается данный атрибут следующим образом: <body bgcolor=»#FFFF99″> </body>. Таким образом, код нашей html странички с желтым фоном будет выглядеть так:
<html> <head> <title>Моя первая страница</title> </head> <body bgcolor="#FFFF99">Вот вы и создали свою первую web страницу!!!</body> </html>
Создайте html страничку, содержащую код, приведенный выше, и посмотрите в браузере, какой она будет иметь цвет фона. Для этого откройте ваш текстовый редактор блокнот скопируйте туда код представленный выше. Затем сохраните текстовый документ с расширением .html, как это сделать мы рассматривали в уроке основы html.
После этого запустите созданный html документ при помощи браузера, и вы увидите, что фон страницы стал бледно желтым. Атрибут bgcolor=»», который задает цвет фона, содержит в кавычках значение «#FFFF99» — это код цвета, который мы хотим задать в качестве фона, полный список таких кодов вы можете посмотреть в таблице html цветов.
Впереди этого кода всегда идет знак решетка “#”, а затем сочетание букв и цифр соответствующее определенному цвету или оттенку. Если вам понадобится узнать значение какого либо цвета или оттенка которого нет в таблице html цветов то это вы можете например сделать с помощью того же графического редактора Photoshop.
Для этого запустите Photoshop и в панели инструментов щелкните по значку выбор цвета (смотрите рисунок ), затем появится палитра цветов в которой с помощью ползунков вы можете выбрать тот или иной цвет, а его код будет отображен в низу, на рисунке оно обведено красным квадратом.
Скопировав это значение и вставив его в кавычки, вы измените цвет фона вашей странички.
Только помните, что впереди значений должен находиться знак решетка #, например #dce8ff. Кроме этого цвет фона html документа можно устанавливать просто словами, например если в нашем атрибуте bgcolor вместо «#FFFF99» прописать «red» т. е. <body bgcolor=»red»> то цвет фона будет красным. Буквенное написание цветов вы также сможете найти в таблице htm кодов цветов.
Материал подготовлен порталом: webmastermix.ru
Рекомендуем ознакомиться:
- Подробности
Обновлено: 04 Сентябрь 2013
Создано: 12 Январь 2010
Просмотров: 106676
Как добавить фон к веб-странице
Как добавить фон к веб-странице?
Сначала сохраните фоновое изображение на свой компьютер: Если вы не знаете или не знаете, как сохранить фоновое изображение на свой компьютер, вы можете просмотреть следующий учебник для получения инструкций: Как сохранить изображение или фон на моем компьютере?
Далее: Загрузите фоновое изображение на свой веб-сайт/сервер.
Где вы решите загрузить изображение на свой сервер, зависит от вас.
Использование кода HTML или CSS: Использование кода HTML или CSS полностью зависит от вас. Либо будет работать. Однако CSS используется более широко. Как только вы сохранили фоновое изображение на свой компьютер и загрузив его на свой сервер, вы можете использовать один из двух следующих кодов, чтобы добавить фон на веб-страницу.
Создание HTML-кода: При использовании HTML-кода для отображения фона на веб-странице вы указываете путь (URL) к фоновому изображению внутри тега * Если вы храните изображения в папке (подкаталоге) на вашем сервере, вам нужно будет включить имя папки в код HTML внутри тега body: Пример: Предположим, для примера, что вы сохранили фон «cutebirdbackground.gif» и загрузили его в папку на своем сервере.
под названием «изображения» ниже приведен пример кода HTML, который будет использоваться. 
yoursiteaddresshere.com/folder/thebackgroundhere.gif»> 
* Если вы храните изображения в папке (подкаталоге) на вашем сервере,вам нужно будет включить имя папки в код CSS:
* «Исправлено» после адреса фона в коде CSS просто означает,что фон не будет прокручиваться на странице,он останется «неподвижным»,когда вы прокручиваете страницу вверх или вниз. Это совершенно необязательно.
* Пример кода CSS между тегами «head».
<голова>  yoursiteaddresshere.com/folder/thebackgroundhere.gif) исправлен; |
Добавление фона в блог:Большинство блогов или других социальных сетей,таких как Blogger или Twitter,позволяют настраивать страницы и загружать фон с компьютера. Я очень рекомендую вас просмотрите их разделы справки,чтобы узнать,как добавить фон. Из-за количества сервисов блогов,доступных сегодня,я не могу знать,как работает каждый из них. :)
Если у вас есть вопросы или вам нужна помощь с приведенными выше кодами,пожалуйста,напишите мне:Свяжитесь с Laura/MyCuteGraphics
Цветовой код HTML для фона и текста на веб-странице
Мы узнаем,как задать цвет фона на нашей странице и как изменить текст,отформатировать его,изменить размер,шрифт и т. д.
Кроме того,мы изучим некоторые ресурсы,чтобы разместить их в интересующей нас части страницы.
С тем,что мы узнаем в этой статье,мы сможем сделать простую страницу. Позже мы увидим,как доставить больше радости.
Есть несколько вещей,которые мы можем настроить в фоновом режиме. В этой статье мы узнаем некоторые из них.
Например,вы заметили полосу прокрутки,которая появляется справа от области навигации? Что ж,это очень полезно…если ваша страница достаточно велика,чтобы не помещаться на весь экран. Таким образом,вы можете прокручивать вверх и вниз.
Но если ваша страница помещается в область навигации без прокрутки,панель не нужна. И тем не менее,он появляется там. Он отключен,но он есть. И это могло быть его желанием,чтобы он не появлялся.
Может даже улучшить окончательный дизайн страницы. Для этого нам нужно использовать атрибут. Атрибуты — это параметры,которые добавляются к тегам для настройки их работы.
Мы можем сделать так,чтобы полоса прокрутки исчезла,если мы добавим к тегу body атрибут прокрутки со значением «no»,так как отображается список без -bar.
html.
Это страница без прокрутки
.
Результатом этого кода является страница,показанная на следующем рисунке:
Другим более современным и подходящим методом было бы объединение нашего веб-документа (HTML) с таблицей стилей (CSS) для удаления полосы прокрутки. Преимущество этого метода в том,что он применяется ко всем браузерам,гарантируя совместимость. Наш веб-документ по имени без -bar.html будет выглядеть следующим образом:
<голова>
<Тело>
ESTO ES una página sin barra de scroll
Как видите,полоса исчезла. В любом случае,вы должны убедиться,что не используете этот эффект,если вашу страницу нужно переместить,так как если вы уберете полосу,у пользователя не будет возможности увидеть всю страницу.
Альтернативой является запись атрибута прокрутки со значением «авто». Это покажет панель только в случае необходимости.
Возможно,одной из самых поразительных возможностей при настройке страницы является использование цвета для ее фона. В примерах из предыдущей статьи мы создали страницу с белым цветом фона. Это цвет области навигации по умолчанию. Давайте посмотрим,как это изменить. Для этого нам нужно добавить еще один атрибут в тег
. В частности,для изменения цвета фона страницы мы используем bgcolor,и мы присваиваем значение,указывающее желаемый цвет. Слово bgcolor является аббревиатурой от цвета фона. Например:если мы хотим,чтобы наша страница имела желтый цвет фона,тег будет выглядеть так:В этой статье мы узнаем много нового о цветах,и цвет нижней части страницы,без сомнения,первое,что захватывает пользователь. Давайте посмотрим,как его изменить. Открыть с ноутбуком. Код Text_simple.html предыдущей статьи и изменить тег
так,чтобы код был следующим образом:
<голова>
<заголовок>
Título de la Página
Estone text
Этот код сохраняет его под именем fundo_amarillo.