Когда на веб-страничке много цветов, она грузится дольше. Но красиво же!
<< вернуться на главную

В верстке страниц используют как 16-тиричный код и код rgb, так и названия цветов, Обозреватель нормально распознает и те и другие. Например, название красного цвета - red в 16-тиричном виде будет #FF0000, в rgb - (255, 0, 0). Здесь представлены названия цветов и их 16-тиричные значения:

Название цвета  Hex-код Цвет
alicemblue #F0F8FF  
antiquewhite #FAEBD7  
aqua #00FFFF  
aquamarine #7FFFD4  
azure #F0FFFF  
beige #F5F5DC  
bisque #FFE4C4  
black #000000  
blanchedalmond #FFEBCD  
blue #0000FF  
blueviolet #8A2BE2  
brown #A52A2A  
burlywood #DEB887  
cadetblue #5F9EA0  
chartreuse #7FFF00  
chocolate #D2691E  
coral #FF7F50  
cornflowerblue #6495ED  
cornsilk #FFF8DC  
crimson #DC143C  
cyan #00FFFF  
darkblue #00008B  
darkcyan #008B8B  
darkgoldenrod #B8860B  
darkgray #A9A9A9  
darkgreen #006400  
darkkhaki #BDB76B  
darkmagenta #8B008b  
darkolivegreen #556B2F  
darkorange #FF8C00  
darkochid #9932CC  
darkred #8B0000  
darksalmon #E9967A  
darkseagreen #8FBC8F  
darkslateblue #483D8B  
darkslategray #2F4F4F  
darkturquoise #00CED1  
darkviolet #9400D3  
deeppink #FF1493  
deepskyblue #00BFFF  
dimgray #696969  
dodgerblue #1E90FF  
firebrick #B22222  
floralwhite #FFFAF0  
forestgreen #228B22  
fushsia #FF00FF  
gainsboro #DCDCDC  
ghostwhite #F8F8FF  
gold #FFD700  
goldenrod #DAA520  
gray #808080  
green #008000  
greenyellow #ADFF2F  
honeydew #F0FFF0  
hotpink #FF69B4  

indiandred

#CD5C5C  
indigo #4B0082  
ivory #FFFFF0  
khaki #F0E68C  
lavender #E6E6FA  
lavenderblush #FFF0F5  
lawngreen #7CFC00  
lemonchiffon #FFFACD  
ligtblue #ADD8E6  
lightcoral #F08080  
lightcyan #E0FFFF  
lightgoldenrodyellow #FAFAD2  
lightgreen #90EE90  
lightgrey #D3D3D3  
lightpink #FFB6C1  
Название цвета Hex-код Цвет
lightsalmon #FFA07A  
lightseagreen #20B2AA  
lightscyblue #87CEFA  
lightslategray #778899  
lightsteelblue #B0C4DE  
lightyellow #FFFFE0  
lime #00FF00  
limegreen #32CD32  
linen #FAF0E6  
magenta #FF00FF  
maroon #800000  
mediumaquamarine #66CDAA  
mediumblue #0000CD  
mediumorchid #BA55D3  
mediumpurple #9370DB  
mediumseagreen #3CB371  
mediumslateblue #7B68EE  
mediumspringgreen #00FA9A  
mediumturquoise #48D1CC  
medium violetred #C71585  
midnightblue #191970  
mintcream #F5FFFA  
mistyrose #FFE4E1  
moccasin #FFE4B5  
navajowhite #FFDEAD  
navy #000080  
oldlace #FDF5E6  
olive #808000  
olivedrab #6B8E23  
orange #FFA500  
orengered #FF4500  
orchid #DA70D6  
palegoldenrod #EEE8AA  
palegreen #98FB98  
paleturquose #AFEEEE  
palevioletred #DB7093  
papayawhop #FFEFD5  
peachpuff #FFDAB9  
peru #CD853F  
pink #FFC0CB  
plum #DDA0DD  
powderblue #B0E0E6  
purple #800080  
red #FF0000  
rosybrown #BC8F8F  
royalblue #4169E1  
saddlebrown #8B4513  
salmon #FA8072  
sandybrown #F4A460  
seagreen #2E8B57  
seashell #FFF5EE  
sienna #A0522D  
silver #C0C0C0  
skyblue #87CEEB  
slateblue #6A5ACD  
slategray #708080  
snow #FFFAFA  
springgreen #00FF7F  
steelblue #4682B4  
tan #D2B48C  
teal #008080  
thistle #D8BFD8  
tomato #FF6347  
turquose #40E0D0  
violet #EE82EE  
wheat #F5DEB3  
white #FFFFFF  
whitesmoke #F5F5F5  
yellow #FFFF00  
yellowgreen #9ACD32  

red-FROG представляет: HTML в примерах v1.1: - эта книга в первую очередь призвана помочь неопытным  веб-строителям, но содержит и некоторую информацию, полезную профессионалам. Это учебник и справочник в одной книге, она познакомит с работой в кодах HTML напрямую. Книга в первую очередь будет полезна тем, кто не любит лишней лирики писателей.
Здесь все устроено на примерах с подробными комментариями. Любители построения сайтов с Java Script также найдут здесь много интересных примеров, узнают больше об этом языке и как им пользоваться. Используя JavaScript вместе с CSS,  можно  украшать такие элементы страниц, как формы, кнопки и т.п. Книга содержит программы на JavaScript, которые помогут в построении сайта сейчас и сразу, много информации о тэгах, применяемых в HTML, дает ответы на многие вопросы...
Автор - киевлянин Владимир Владимирович Дригалкин, LENIN INC                                         
http://lenininc.narod.ru/                                                              наверх


Элементы CSS, метатеги, прокрутка, таблицы, всплывающие окна

Если мы распологаем стили в отдельном файле, тогда между тэгами <HEAD></HEAD> каждого документа нужно добавить ссылку на CSS файл:

<LINK REL=STYLESHEET TYPE="text/css" HREF="Example.css">

Example.css - наш CSS файл, содержащий описание применяемых стилей. Если он находиться в другом каталоге, нужно указать к нему путь. Создается CSS файл в текстовом редакторе, например, в Блокноте, нужно будет только изменить расширение текстового файла на CSS. В CSS файле не должны указыватся тэги <STYLE></STYLE>! Мы можем определить стиль для любого тэга отдельно. Для этого нужно в тэг добавить элемент STYLE и описать его стиль в кавычках. Наш пример отображает слово "Пример" шрифтом Verdana, размером 150 процентов и красным цветом:

<H3 STYLE="font-family:Verdana; font-size:150%; color:red"> Пример </H3> 

В таблице приведены некоторые свойства элементов, управляемых с помощью CSS:

Свойства шрифта:
font-family Используется для указания шрифта или шрифтового семейства, которым будет отображаться элемент.
Пример:
P {font-family: Verdana, sans-serif;}
font-weight Определяет степень жирности шрифта с помощью трех параметров: lighter (обычный), bold (жирный), bolder (очень жирный)
Пример:
B {font-weight: bolder;}
font-size Устанавливает размер шрифта. Параметр может указываться в процентах, пикселях или сантиметрах.
Примеры использования для тэгов H1, H2, H3:
H1 {font-size: 200%;}
H2 {font-size: 150px;}
H3 {font-size: 400pt;}

Свойства текста:

text-decoration Устанавливает эффекты оформления шрифта, такие, как подчеркивание или зачеркивание текста
Пример использования для тэга Н4:
H4 {text-decoration: underline;} (подчеркивание)
H4 {text-decoration: line-through;} (зачеркивание)
text-align Определяет выравнивание элемента.
Пример:
P {text-align: left} (выравнивание по левому краю)
P {text-align: right} (выравнивание по правому краю)
P {text-align: justify} (выравнивание по ширине)
P {text-align: center} (выравнивание по центру)
text-indent Устанавливает отступ первой строки текста. Чаще всего используется для создания параграфов с табулированной первой строкой.
Пример использования для тэга H1:
H1 {text-indent: 60pt;}
line-height Управляет интервалами между строками текста.
Пример:
P {line-height: 50 %}

Цвет элемента и фона:

color Определяет цвет элемента I {color: yellow;}
Пример использования для тэга H3:
H3 {color: #0000FF;}
background-color Устанавливает цвет фона для элемента.
Пример использования для тэга H3:

<H3 style=”background-color:gold; color:brown;”> Пример </H3>

Пример

Свойства границ:
margin-left (слево)
margin-right (справо)
margin-top (сверху)
margin-bottom (снизу)
Устанавливают значения отступов вокруг элемента.
Пример использования для рисунка:
IMG { margin-left: 20pt}
IMG { margin-right: 20pt}
IMG { margin-top: 20pt}
IMG { margin-bottom: 20pt}
Единицы измерения:
px Пиксели
cm Сантиметры
mm Миллиметры
pt или % проценты

Для написания метатегов предназначен Создатель МЕТА-тэгов от Владимира Дригалкина, который сделал превосходное пособие по ручному созданию сайтов HTML В ПРИМЕРАХ:

LENIN INC Meta tegs creator v1.3

Название страницы:
Кодировка:
Имя автора:
E-Mail:
Описание документа:
Ключевые слова:
(через запятую)
© 2001 by Vladimir Drigalkin (LENIN INC)

На сайте Автора есть, как говорится - золотая дюжина великолепных программ, облегчающих работу с текстами, таблицами и прочими причиндалами в сайтах без наворотов. Кстати о таблицах - ниже и еще через два абзаца даются три скриптовые программки, поверьте на слово - не хуже Создателя метатегов и сделанные по тому же принципу. Но если их не видно, значит - в настройках браузера запрещено показывать эти изображения. Если все вам нужны утилтки, можно скопировать страничку и уже дома спокойно работать с ними...  
ТАБЛИЦЫ нам сделает в несколько кликов еще одна замечательная программа:

Иногда, попадая на какой-то сайт, цвет прокрутки Обозревателя меняется (если обозреватель Internet Explorer версии не ниже 5.5). Создают такой эффект - стили (CSS). На сегодняшний день существуют восемь атрибутов, которыми можно задавать различные параметры прокрутки: scrollbar-3d-light-color - цвет контуров (окантовки) прокрутки scrollbar-arrow-color - цвет стрелочек на полосе вертикальной прокрутки scrollbar-base-color - базовый цвет прокрутки (фон) scrollbar-dark-shadow-color - тень прокрутки (более затемненная) scrollbar-face-color - цвет прокрутки scrollbar-highlight-color - цвет полос, по которым движется прокрутка (фон) scrollbar-shadow-color - тень прокрутки (обычная) scrollbar-track-color - цвет полос, по которым движется прокрутка. Чтобы изменить цвет прокрутки, поместите (не обязательно все) атрибуты в тэге <BODY>, в качестве значений присвойте 16-тиричный вид цвета или его название на английском языке; где их взять? а для этого есть утилита от Алексея Петровича Радченко Цветик - которая работает и по фону, и по шрифтам http://www.rvsn2.narod.ru/

<body style="scrollbar-3d-light-color: #000000; scrollbar-arrow-color: #F2F5FF; scrollbar-base-color: #F2F5FF; scrollbar-dark-shadow-color: #000000; scrollbar-face-color: #475059; scrollbar-highlight-color: #B8C2CC; scrollbar-shadow-color: #B8C2CC; scrollbar-track-color: #262D34;">

В создании цветовой гаммы прокруток за пару кликов нам всегда поможет вот эта программа:

LENIN INC Scrollbar Color Wizard v1.0
CSS HEX
Здесь Вы увидите результат своих стараний...



















scrollbar-3d-light-color:
scrollbar-arrow-color:
scrollbar-base-color:
scrollbar-dark-shadow-color:
scrollbar-face-color:
scrollbar-highlight-color:
scrollbar-shadow-color:
scrollbar-track-color:   

© 2001 by Vladimir Drigalkin (LENIN INC)

Иногда надо создать ссылку для открытия нового окна с определенными элементами управления: типа хочется убрать строку статуса, меню и т.д. В этой программке В.Дригалкина достаточно вычеркнуть элемент по умолчанию http:// и смело нажимать кнопку Предпросмотр - отобразятся варианты пустых окон для выбора; программа рабочая:

LENIN INC Windows creater v1.0

URL:
Ширина окна:
Высота окна:
Имя ссылки:
Панель инструментов:
Адрес:
Ссылки:
Строка состояния:
Меню:
Прокрутки:
Растягивание мышью:

© 2002 by Vladimir Drigalkin (LENIN INC)

В любом случае, очень советую скачать и сделать буквально настольной эту замечательную книжку.   наверх