БЕСПЛАТНЫЕ УРОКИ. Создание сайтов

HTML. Фон страницы

Было бы скучно и однообразно, если б фон страниц веб-сайтов оставался всегда белым. Но в HTML можно установить не только цвет фона, но и задать фоновое изображение.

Тэг, который позволяет изменить фон вам уже знаком, - это тэг <BODY>. А с его атрибутами сейчас познакомимся.

Чтобы залить фон цветом

Для заливки фона у тэга BODY есть атрибут BGCOLOR.

Для примера возьмем следующую практическую

 <HTML>
<HEAD>
<TITLE>
Виды облаков
</TITLE>
</HEAD>
<BODY>
<H1 ALIGN="CENTER">
Виды облаков
</H1>
<P ALIGN="JUSTIFY">
<B><I>Перистые облака</I></B> имеют толщину от сотен метров до нескольких километров.
Они состоят из ледяных кристаллов в форме игл, столбиков, пластинок.
</P>
<P ALIGN="JUSTIFY">
<B><I>Перисто-кучевые облака</I></B> характеризуются небольшой шириной- 200-400 м. Структура облаков комковая. Они прозрачные.
</P>
<P ALIGN="JUSTIFY">
<B><I>Перисто-слоистые облака</I></B> имеют вид белой или голубоватой полупрозрачной пелены. Их толщина колеблется от 100 м до нескольких километров.
</P>
<P ALIGN="JUSTIFY">
<B><I>Высоко-кучевые облака</I></B> выглядят как белые, иногда сероватые волны, состоящие из пластин или хлопьев, разделенных  просветами голубого неба, но могут сливаться и в сплошной покров. Толщина слоя высоко-кучевых облаков около 200-700 м. Из них выпадает дождь, снег.
</P>
<P ALIGN="JUSTIFY">
<B><I>Высоко-слоистые облака</I></B> образуют сплошной серый или синеватый "ковер" на небе с нижней границей обычно на высоте 3-5 км. Толщина облачных слоев 1-2 км.
</P>
<P ALIGN="JUSTIFY">
<B><I>Слоисто-кучевые облака</I></B>-это серые облака, состоящие из крупных гряд, волн, пластин, разделенных просветами или сливающимися в сплошной серый волнистый покров. Состоят преимущественно из капель.
</P>
<P ALIGN="JUSTIFY">
<B><I>Слоистые облака</I></B> представляют из себя однородный серый или серо-желтый покров.
</P>
<P ALIGN="JUSTIFY">
<B><I>Слоисто-дождевые облака</I></B> выглядят как сплошная серая пелена, закрывающий все небо в виде гряд и валов. Они состоят из водяных капель, редко в смеси со снежинками.
</P>
<P ALIGN="JUSTIFY">
<B><I>Кучевые облака</I></B> подразделяют на кучевые, кучевые средние и кучевые мощные. Толщина 1-2 км, иногда 3-5 км.
</P>
<P ALIGN="JUSTIFY">
<B><I>Кучево-дождевые облака</I></B> - очень мощные облачные скопления.
</P>
</BODY>
</HTML>
 

Результат:

результат исполнения кода

Для того чтобы залить фон голубым фоном в тэге BODY нужно указать атрибут BGCOLOR.

 <BODY BGCOLOR="#3399FF">
 

И укажем, что мы хотели бы видеть текст белого цвета.

Это можно указать с помощью тэга <FONT COLOR=”FFFFFF”>. Но если нужно указать, чтобы текст всей страницы был одного цвета, это можно указать в тэге BODY

 <BODY TEXT="#FFFFFF">
 

В результате получим код

 <HTML>
<HEAD>
<TITLE>
Виды облаков
</TITLE>
</HEAD>
<BODY BGCOLOR="#3399FF" TEXT="#FFFFFF">
<H1 ALIGN="CENTER">
Виды облаков
</H1>
<P ALIGN="JUSTIFY">
<B><I>Перистые облака</I></B> имеют толщину от сотен метров до нескольких километров.
Они состоят из ледяных кристаллов в форме игл, столбиков, пластинок.
</P>
<P ALIGN="JUSTIFY">
<B><I>Перисто-кучевые облака</I></B> характеризуются небольшой шириной- 200-400 м. Структура облаков комковая. Они прозрачные.
</P>
<P ALIGN="JUSTIFY">
<B><I>Перисто-слоистые облака</I></B> имеют вид белой или голубоватой полупрозрачной пелены. Их толщина колеблется от 100 м до нескольких километров.
</P>
<P ALIGN="JUSTIFY">
<B><I>Высоко-кучевые облака</I></B> выглядят как белые, иногда сероватые волны, состоящие из пластин или хлопьев,разделенных  просветами голубого неба,но могут сливаться и в сплошной покров. Толщина слоя высоко-кучевых облаков около 200-700 м. Из них выпадает дождь,снег.
</P>
<P ALIGN="JUSTIFY">
<B><I>Высоко-слоистые облака</I></B> образуют сплошной серый или синеватый "ковер" на небе с нижней границей обычно на высоте 3-5 км. Толщина облачных слоев 1-2 км.
</P>
<P ALIGN="JUSTIFY">
<B><I>Слоисто-кучевые облака</I></B>-это серые облака, состоящие из крупных гряд, волн, пластин, разделенных просветами или сливающимися в сплошной серый волнистый покров. Состоят преимущественно из капель.
</P>
<P ALIGN="JUSTIFY">
<B><I>Слоистые облака</I></B> представляют из себя однородный серый или серо-желтый покров.
</P>
<P ALIGN="JUSTIFY">
<B><I>Слоисто-дождевые облака</I></B> выглядят как сплошная серая пелена, закрывающий все небо в виде гряд и валов. Они состоят из водяных капель,редко в смеси со снежинками.
</P>
<P ALIGN="JUSTIFY">
<B><I>Кучевые облака</I></B> подразделяют на кучевые, кучевые средние и кучевые мощные. Толщина 1-2 км, иногда 3-5 км.
</P>
<P ALIGN="JUSTIFY">
<B><I>Кучево-дождевые облака</I></B> - очень мощные облачные скопления.
</P>
</BODY>
</HTML>
 

А в браузере увидим:

результат исполнения кода с заливкой

Чтобы установить фоновое изображение

При желании фон можно залить изображением. Для этого в папке сайта создаем папку images, в которую сохраним изображение фона fon.jpg. А для заливки воспользуемся атрибутом BACKGRAUND тэга BODY .

Это будет выглядеть так:

 <HTML>
<HEAD>
<TITLE>
Виды облаков
</TITLE>
</HEAD>
<BODY BACKGROUND="images/fon.jpg">
<H1 ALIGN="CENTER">
Виды облаков
</H1>
<P ALIGN="JUSTIFY">
<B><I>Перистые облака</I></B> имеют толщину от сотен метров до нескольких километров.
Они состоят из ледяных кристаллов в форме игл, столбиков, пластинок.
</P>
<P ALIGN="JUSTIFY">
<B><I>Перисто-кучевые облака</I></B> характеризуются небольшой шириной- 200-400 м. Структура облаков комковая. Они прозрачные.
</P>
<P ALIGN="JUSTIFY">
<B><I>Перисто-слоистые облака</I></B> имеют вид белой или голубоватой полупрозрачной пелены. Их толщина колеблется от 100 м до нескольких километров.
</P>
<P ALIGN="JUSTIFY">
<B><I>Высоко-кучевые облака</I></B> выглядят как белые, иногда сероватые волны, состоящие из пластин или хлопьев,разделенных  просветами голубого неба,но могут сливаться и в сплошной покров. Толщина слоя высоко-кучевых облаков около 200-700 м. Из них выпадает дождь,снег.
</P>
<P ALIGN="JUSTIFY">
<B><I>Высоко-слоистые облака</I></B> образуют сплошной серый или синеватый "ковер" на небе с нижней границей обычно на высоте 3-5 км. Толщина облачных слоев 1-2 км.
</P>
<P ALIGN="JUSTIFY">
<B><I>Слоисто-кучевые облака</I></B>-это серые облака, состоящие из крупных гряд, волн, пластин, разделенных просветами или сливающимися в сплошной серый волнистый покров. Состоят преимущественно из капель.
</P>
<P ALIGN="JUSTIFY">
<B><I>Слоистые облака</I></B> представляют из себя однородный серый или серо-желтый покров.
</P>
<P ALIGN="JUSTIFY">
<B><I>Слоисто-дождевые облака</I></B> выглядят как сплошная серая пелена, закрывающий все небо в виде гряд и валов. Они состоят из водяных капель,редко в смеси со снежинками.
</P>
<P ALIGN="JUSTIFY">
<B><I>Кучевые облака</I></B> подразделяют на кучевые, кучевые средние и кучевые мощные. Толщина 1-2 км, иногда 3-5 км.
</P>
<P ALIGN="JUSTIFY">
<B><I>Кучево-дождевые облака</I></B> - очень мощные облачные скопления.
</P>
</BODY>
</HTML>
 

Результат:

результат с использование фонового изображения

Добавить комментарий
  • Комментарии не найдены