Четверг, 16.05.2024, 05:32 | RSS | Приветствую Вас Гость | Регистрация на сайте | Вход


Главная страница | Все новости | Файлы и программы | Фильмы on-line | Уроки и статьи | Форумы

Меню сайта
Форма входа
Логин:
Пароль:
Поиск
Наш опрос
Дизайн сайта

Архив
Результаты
Всего голосовало: 61
Реклама
Мини-чат
200
Статистика

Фильмов: 37
Новостей: 28
Файлов: 69
Статей: 30

Нас уже: 10381
Онлайн всего: 1
Гостей: 1
Пользователей: 0

Сегодня тут были:

Друзья сайта
MEGA-ToP-ТОП раскрутка раскрутка сайтов.
Теги
load (4)
Avast (1)
cs3 (1)
nocd (1)
Nod 32 (1)
nodvd (1)
Online (1)
paint (1)
PS (1)
Sam (1)

Главная » Статьи » Скрипты для ucoz » HTML-уроки

Урок "Таблицы"
Все мы знаем, что такое таблицы, но не каждый знает их применение в HTML-дизайне. Рассмотрим несколько вариантов :

1. Очень простая:
proplanet
proplanet
proplanet
опля



Вот код для этой таблицы:


<table border="1" cellpadding="10">
<tr><td>pro</td><td>pla</td><td>net</td></tr>
<tr><td>pro</td><td>pla</td><td>net</td></tr>
<tr><td>pro</td><td>pla</td><td>net</td></tr>
<tr><td>оп</td><td>ля</td></tr>
</table>

Как придумать и сделать самому обычную таблицу. Знакомство с кодами
<table> - начало таблицы
<tr> - начало строки
<td> - начало кода, или надписи
</td> - конец кода, или надписи
</tr> - конец строки
</table> - конец таблицы

Код аблица с двумя тремя и более строками выглядит так

<table> - начало таблицы

<tr> - начало первой  строки
<td> - начало кода, или надписи
</td> - конец кода, или надписи
</tr> - конец первой строки

<tr> - начало второй строки
<td> - начало кода, или надписи
</td> - конец кода, или надписи
</tr> - конец второй строки

<tr> - начало третей строки
<td> - начало кода, или надписи
</td> - конец кода, или надписи
</tr> - конецтретей  строки

</table> - конец таблицы

2. Простая:

Слева Центр Справа

Вот код для этой таблицы:


<table style="border: 1px solid rgb(225, 225, 225);" width="97%"
align="center" border="0" cellpadding="5" cellspacing="0">
<tbody><tr><td style="background: rgb(255, 255, 255) none repeat scroll 0% 0%; -moz-background-clip:
-moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"><!-- <body> -->
<table width="92%" align="center" border="0" cellpadding="0" cellspacing="0">
<tbody><tr>
<td style="white-space: nowrap;" align="left">Слева</td>
<td style="white-space: nowrap;" align="center">Центр</td>
<td style="white-space: nowrap;" align="right">Справа</td>
</tr>
</tbody></table>
</td></tr></tbody></table>

Так же в таблицах можно менять цвет, вот и пример:

Главнаяотзыв
ProPlanet.3dn.RuУроки...

Код для этой таблицы:


<table border="1" cellspacing="0" cellpadding="5" width="600" bgcolor="ffffff">
<tr height="45" bgcolor="708080"><th width="35%">Главная</th><th>отзыв</th></tr>
<tr><td>ProPlanet.3dn.Ru</td><td>Уроки...</td></tr>
</table>

bgcolor="#ffffff" Это цвет фона таблицы (белый)

bgcolor="#708080" Это цвет фона таблицы (серый)

Как узнать код для того или иного цвета?
Ответ: вот таблица с распр. цветами:

Название цветаКод
alicemblueF0F8FF
antiquewhiteFAEBD7
aqua00FFFF
aquamarine7FFFD4
azureF0FFFF
beigeF5F5DC
bisqueFFE4C4
black000000
blanchedalmondFFEBCD
blue0000FF
blueviolet8A2BE2
brownA52A2A
burlywoodDEB887
cadetblue5F9EA0
chartreuse7FFF00
chocolateD2691E
coralFF7F50
cornflowerblue6495ED
cornsilkFFF8DC
crimsonDC143C
cyan00FFFF
darkblue00008B
darkcyan008B8B
darkgoldenrodB8860B
darkgrayA9A9A9
darkgreen006400
darkkhakiBDB76B
darkmagenta8B008b
darkolivegreen556B2F
darkorangeFF8C00
darkochid9932CC
darkred8B0000
darksalmonE9967A
darkseagreen8FBC8F
darkslateblue483D8B
darkslategray2F4F4F
darkturquoise00CED1
darkviolet9400D3
deeppinkFF1493
deepskyblue00BFFF
dimgray696969
dodgerblue1E90FF
firebrickB22222
floralwhiteFFFAF0
forestgreen228B22
fushsiaFF00FF
gainsboroDCDCDC
ghostwhiteF8F8FF
goldFFD700
goldenrodDAA520
gray808080
green008000
greenyellowADFF2F
honeydewF0FFF0
hotpinkFF69B4
indiandredCD5C5C
indigo4B0082
ivoryFFFFF0
khakiF0E68C
lavenderE6E6FA
lavenderblushFFF0F5
lawngreen7CFC00
lemonchiffonFFFACD
ligtblueADD8E6
lightcoralF08080
lightcyanE0FFFF
lightgoldenrodyellowFAFAD2
lightgreen90EE90
lightgreyD3D3D3
lightpinkFFB6C1
lightsalmonFFA07A
lightseagreen20B2AA
lightscyblue87CEFA
lightslategray778899
lightsteelblueB0C4DE
lightyellowFFFFE0
lime00FF00
limegreen32CD32
linenFAF0E6
magentaFF00FF
maroon800000
mediumaquamarine66CDAA
mediumblue0000CD
mediumorchidBA55D3
mediumpurple9370DB
mediumseagreen3CB371
mediumslateblue7B68EE
mediumspringgreen00FA9A
mediumturquoise48D1CC
mediumvioletredC71585
midnightblue191970
mintcreamF5FFFA
mistyroseFFE4E1
moccasinFFE4B5
navajowhiteFFDEAD
navy000080
oldlaceFDF5E6
olive808000
olivedrab6B8E23
orangeFFA500
orengeredFF4500
orchidDA70D6
palegoldenrodEEE8AA
palegreen98FB98
paleturquoseAFEEEE
palevioletredDB7093
papayawhopFFEFD5
peachpuffFFDAB9
peruCD853F
pinkFFC0CB
plumDDA0DD
powderblueB0E0E6
purple800080
redFF0000
rosybrownBC8F8F
royalblue4169E1
saddlebrown8B4513
salmonFA8072
sandybrownF4A460
seagreen2E8B57
seashellFFF5EE
siennaA0522D
silverC0C0C0
skyblue87CEEB
slateblue6A5ACD
slategray708080
snowFFFAFA
springgreen00FF7F
steelblue4682B4
tanD2B48C
teal008080
thistleD8BFD8
tomatoFF6347
turquose40E0D0
violetEE82EE
wheatF5DEB3
whiteFFFFFF
whitesmokeF5F5F5
yellowFFFF00
yellowgreen9ACD32



Категория: HTML-уроки | Добавил: SkyWay (17.05.2009) | Автор: Limax
Просмотров: 733 | Рейтинг: 5.0/1 |
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Copyright ProPlanet.3dn.ru ©
Все права не нарушены
Хостинг от uCoz
Design by SkyWay (aka LiMaX)