Место для style CSS в HTML коде
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>CSS</TITLE>
<STYLE TYPE="text/css">
Сюда вставляем нужный style CSS
</STYLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Фоновый рисунок страницы
body {
background-image: url('picture.gif'); /* Путь к
фоновому изображению */
}
Фоновый рисунок таблицы
table {
background-image: url('picture.gif'); /* Путь к
фоновому изображению */
background-color: #3366CC; /* Цвет фона таблицы */
}
Фоновый рисунок ячейки
Если вам необходимо в какой то из ячеек использовать
фоновый рисунок
в нужной ячейке пишем <TD CLASS="c1">
TD.c1 {
background-image: url('picture.gif'); /* Путь к
фоновому изображению */
}
TD.c1 {
background-image: url('www.ваш-сайт.ru/папка/картинка.формат');
}
пример вставки разных фоновых рисунков в несколько ячеек
<!DOCTYPE
html PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>Ячейки</TITLE>
<META content=russian
name=Content-Language>
<META http-equiv=Content-Type
content="text/html; charset=windows-1251">
<STYLE TYPE="text/css">
TD.c1 {
background-image: url('image/01.gif');
}
TD.c2 {
background-image: url('image/02.gif');
}
TD.c3 {
background-image: url('image/03.gif');
}
TD.c4 {
background-image: url('image/04.gif');
}
</STYLE>
</HEAD>
<BODY>
<TABLE WIDTH="100%" BORDER=0 CELLSPACING=0
CELLPADDING=0>
<TR>
<TD CLASS="c1"></TD>
<TD CLASS="c2"></TD>
<TD CLASS="c3"></TD>
<TD CLASS="c4"></TD>
</TR>
</TABLE>
</BODY>
</html>
Названия web цветов и шестнадцатеричное значение
Ivory
#FFFFF0
|
LightYellow
#FFFFE0
|
Snow
#FFFAFA
|
FloralWhite
#FFFAF0
|
LemonChiffon
#FFFACD
|
Cornsilk
#FFF8DC
|
Seashell
#FFF5EE
|
LavenderBlush
#FFF0F5
|
NavajoWhite
#FFDEAD
|
PeachPuff
#FFDAB9
|
Gold
#FFD700
|
PapayaWhip
#FFEFD5
|
BlanchedAlmond
#FFEBCD
|
Moccasin
#FFE4B5
|
MistyRose
#FFE4E1
|
Bisque
#FFE4C4
|
Pink
#FFC0CB
|
LightPink
#FFB6C1
|
Orange
#FFA500
|
LightSalmon
#FFA07A
|
DarkOrange
#FF8C00
|
Coral
#FF7F50
|
HotPink
#FF69B4
|
Tomato
#FF6347
|
OrangeRed
#FF4500
|
DeepPink
#FF1493
|
OldLace
#FDF5E6
|
LightGoldenrodYellow
#FAFAD2
|
Linen
#FAF0E6
|
AntiqueWhite
#FAEBD7
|
Salmon
#FA8072
|
GhostWhite
#F8F8FF
|
MintCream
#F5FFFA
|
WhiteSmoke
#F5F5F5
|
Beige
#F5F5DC
|
Wheat
#F5DEB3
|
SandyBrown
#F4A460
|
Azure
#F0FFFF
|
Honeydew
#F0FFF0
|
AliceBlue
#F0F8FF
|
Khaki
#F0E68C
|
LightCoral
#F08080
|
PaleGoldenrod
#EEE8AA
|
Violet
#EE82EE
|
DarkSalmon
#E9967A
|
Lavender
#E6E6FA
|
LightCyan
#E0FFFF
|
BurlyWood
#DEB887
|
Plum
#DDA0DD
|
Gainsboro
#DCDCDC
|
Crimson
#DC143C
|
PaleVioletRed
#DB7093
|
Goldenrod
#DAA520
|
Orchid
#DA70D6
|
Thistle
#D8BFD8
|
Chocolate
#D2691E
|
LightGrey
#D3D3D3
|
Tan
#D2B48C
|
Peru
#CD853F
|
IndianRed
#CD5C5C
|
MediumVioletRed
#C71585
|
Silver
#C0C0C0
|
DarkKhaki
#BDB76B
|
RosyBrown
#BC8F8F
|
MediumOrchid
#BA55D3
|
DarkGoldenrod
#B8860B
|
FireBrick
#B22222
|
PowderBlue
#B0E0E6
|
LightSteelBlue
#B0C4DE
|
PaleTurquoise
#AFEEEE
|
GreenYellow
#ADFF2F
|
LightBlue
#ADD8E6
|
DarkGray
#A9A9A9
|
Brown
#A52A2A
|
Sienna
#A0522D
|
YellowGreen
#9ACD32
|
DarkOrchid
#9932CC
|
PaleGreen
#98FB98
|
DarkViolet
#9400D3
|
MediumPurple
#9370DB
|
LightGreen
#90EE90
|
DarkSeaGreen
#8FBC8F
|
SaddleBrown
#8B4513
|
DarkMagenta
#8B008B
|
DarkRed
#8B0000
|
BlueViolet
#8A2BE2
|
LightSkyBlue
#87CEFA
|
SkyBlue
#87CEEB
|
Gray
#808080
|
Olive
#808000
|
Purple
#800080
|
Maroon
#800000
|
Chartreuse
#7FFF00
|
Aquamarine
#7FFFD4
|
LawnGreen
#7CFC00
|
MediumSlateBlue
#7B68EE
|
LightSlateGray
#778899
|
SlateGray
#708090
|
OliveDrab
#6B8E23
|
SlateBlue
#6A5ACD
|
DimGray
#696969
|
MediumAquamarine
#66CDAA
|
CornflowerBlue
#6495ED
|
CadetBlue
#5F9EA0
|
DarkOliveGreen
#556B2F
|
Indigo
#4B0082
|
MediumTurquoise
#48D1CC
|
DarkSlateBlue
#483D8B
|
SteelBlue
#4682B4
|
RoyalBlue
#4169E1
|
Turquoise
#40E0D0
|
MediumSeaGreen
#3CB371
|
LimeGreen
#32CD32
|
DarkSlateGray
#2F4F4F
|
SeaGreen
#2E8B57
|
ForestGreen
#228B22
|
LightSeaGreen
#20B2AA
|
DodgerBlue
#1E90FF
|
MidnightBlue
#191970
|
SpringGreen
#00FF7F
|
MediumSpringGreen
#00FA9A
|
DarkTurquoise
#00CED1
|
DeepSkyBlue
#00BFFF
|
DarkCyan
#008B8B
|
Teal
#008080
|
Green
#008000
|
DarkGreen
#006400
|
MediumBlue
#0000CD
|
DarkBlue
#00008B
|
Navy
#000080
|
Black
#000000
|
Цвет фона и рамки DIV
DIV.outline2 {
border: 2px dotted
#000080 ; /* Цвет и толщина рамки*/
background: #C0C0C0; /* Цвет фона */
padding: 10px; /* Поля вокруг текста */
}
Для изменения вида рамки меняйте значения параметра border
Вид рамки в зависимости от стиля и толщины границы DIV
1 пиксел |
3 пиксела |
5 пикселов |
7 пикселов |
dotted |
dotted |
dotted |
dotted |
dashed |
dashed |
dashed |
dashed |
solid |
solid |
solid |
solid |
double |
double |
double |
double |
groove |
groove |
groove |
groove |
ridge |
ridge |
ridge |
ridge |
inset |
inset |
inset |
inset |
outset |
outset |
outset |
outset |
Выделение части текста цветом
.colortext {
color: red; /* Красный цвет символов */
}
Камни-целители, хранители и защитники от скверны.
<span class="colortext">К ним относится весь род нефритов.</span> Нефрит, жадеит, жад - это родственные камни, разные очень, от зеленоватых до белых, розоватых, голубых, оранжевых.
Цвет и размер заголовков <h1> - <h6>
h1{font:10pt Verdana;font-weight:bold;color: blue;}
h2{font:12pt Verdana;font-weight:bold;color: green;}
h3{font:14pt Verdana;font-weight:bold;color: red;}
h4{font:16pt Verdana;font-weight:bold;color: yellow;}
h5{font:18pt Verdana;font-weight:bold;color: brown;}
Заголовок
Заголовок
Заголовок
Заголовок
Заголовок
Цвет, размер и гарнитура текста
SPAN.warning {font:10pt
Verdana;font-weight:bold; color: teal ;}
SPAN.intro {font:10pt Verdana;font-weight:bold;
color: red;}
SPAN.kon {font:10pt Verdana;font-weight:bold;
color: green;}
SPAN.info {font:10pt Verdana;font-weight:bold;
color: peru;}
SPAN.roor {font:10pt Verdana;font-weight:bold;
color: navy;}
Цвет
текста
Цвет текста
Цвет
текста
Цвет
текста
<P><SPAN id="msg1" class="intro" lang="ru">Цвет текста</SPAN></P>
Цвет фона под текстом
H6 {
background-color: RGB(249, 201, 16); /* Цвет фона под заголовком */
}
P {
background-color: maroon; /* Цвет фона под текстом параграфа */
color: white; /* Цвет текста */
}
<h6>Цвет фона под заголовком</h6>
<p>Цвет фона под текстом параграфа</p>
Цвет фона под заголовком
Цвет фона под текстом параграфа
|