Работа на дому

Заработок в Интернете без вложений.
Москва
pogoda.ru.net
 
 
 
 
 
 

Полезная информация
Необходимо выставить права 777 на папку 78435758








PR-CY.ru
Оплачиваемая реклама.


Таблицы html.

   Создание сайтов в таблицах HTML пользуется большой популярностью среди web мастеров из-за хорошей индексации поисковых машин. В этом разделе мы с Вами научимся создавать самостоятельно страницы сайта в таблицах, а также задавать для них различные параметры (цвет, размер и т.д.). В начале давайте познакомимся с основными элементами, которые нужны для формирования web страницы.

   Каждая таблица html это своеобразный контейнер, состоящий из открывающего тэга html таблицы <table> и закрывающего тэга html таблицы </table>. Внутри этого контейнера находятся ячейки таблиц html, которые задаются тэгами <tr></tr> и <td></td>.

<tr></tr> - задаёт количество горизонтальных рядов таблицы
(строчки).
<td></td> - задаёт количество вертикальных рядов таблицы
(столбцы).

Все эти тэги являются обязательными при построении таблиц html. Пример таблицы html из трёх строчек и двух столбцов Вы видите ниже:

строчка1 столбец1 строчка1 столбец2
строчка 2 столбец1 строчка 2 столбец2
строчка 3 столбец1 строчка 3 столбец2

А вот как выглядит код HTML приведённого примера:

<table>
<tr>
<td>
строчка1 столбец1</td>
<td>
строчка1 столбец2</td>
</tr>
<tr>
<td>
строчка 2 столбец1</td>
<td>
строчка 2 столбец2</td>
</tr>
<tr>
<td>
строчка 3 столбец1</td>
<td>
строчка 3 столбец2</td>
</tr>
</table>




Как видно из примера, начинается наша таблица с открывающего тэга <table>, далее мы задаём количество строк <tr></tr>, в них прописываем количество столбцов <td></td>. Всё довольно таки просто.
Теперь давайте разберёмся с дополнительными параметрами для красивого оформления нашей таблицы, с целью повышения посещаемости и увеличения заработка в интернете. Вначале сделаем рамку таблицы html. Рамка вводится параметром border и прописывается в тэге <table>:

<table border="2">

   Также мы можем задать цвет для рамки html. Это делается с помощью атрибута bordercolor:

<table border="2" bordercolor="#990066">

Теперь вставим эти атрибуты в наш пример:

<table border="2" bordercolor="#990066">
<tr>
<td>
строчка1 столбец1</td>
<td>
строчка1 столбец2</td>
</tr>
<tr>
<td>
строчка 2 столбец1</td>
<td>
строчка 2 столбец2</td>
</tr>
<tr>
<td>
строчка 3 столбец1</td>
<td>
строчка 3 столбец2</td>
</tr>
</table>




А вот как это будет выглядеть в браузере:

строчка1 столбец1 строчка1 столбец2
строчка 2 столбец1 строчка 2 столбец2
строчка 3 столбец1 строчка 3 столбец2

   Теперь с помощью атрибутов height и width изменим высоту и ширину ячеек нашей таблицы html. Параметр height в каждой строке задаётся для одной ячейки, так как остальные ячейки выровняются по этому размеру. Если Вы зададите высоту первой ячейки 50, а второй ячейки 150, то все ячейки примут размер 150, так как все ячейки в строке выравниваются по наибольшему размеру. Параметр width задаётся для каждой ячейки в строке, а для последующих строк просто дублируется. Ширина ячеек, также как и высота выравнивается по наибольшему размеру:

<table border="2" bordercolor="#990066">
<tr>
<td height="50" width="200">
строчка1
столбец1
</td>
<td width="150">
строчка1 столбец2</td>
</tr>
<tr>
<td height="100" width="200">
строчка 2
столбец1
</td>
<td width="150">
строчка 2 столбец2</td>
</tr>
<tr>
<td height="50" width="200">
строчка 3
столбец1
</td>
<td width="150">
строчка 3 столбец2</td>
</tr>
</table>



А вот как это будет выглядеть в браузере:

строчка1 столбец1 строчка1 столбец2
строчка 2 столбец1 строчка 2 столбец2
строчка 3 столбец1 строчка 3 столбец2

В данном примере мы задали ширину и высоту ячеек в пикселях, а можно задавать и в процентах. Сумма высоты всех строчек height также как и сумма ширины всех ячеек width не должна превышать 100%.
Пример:

<table height="100%" width="100%"
border="2" bordercolor="#990066">
<tr>
<td height="15%" width="20%">
строчка1
столбец1
</td>
<td width="80%">
строчка1 столбец2</td>
</tr>
<tr>
<td height="45%" width="20%">
строчка 2
столбец1
</td>
<td width="80%">
строчка 2 столбец2</td>
</tr>
<tr>
<td height="40%" width="20%">
строчка 3
столбец1
</td>
<td width="80%">
строчка 3 столбец2</td>
</tr>
</table>



Вид таблицы в браузере:

строчка1 столбец1 строчка1 столбец2
строчка2 столбец1 строчка2 столбец2
строчка3 столбец1 строчка3 столбец2

Из примера видно, что если сложить высоту height всех строчек (15+45+40), то в сумме получим 100%. То же самое и с шириной width (80+20) в сумме получаем 100%.

Вы можете задать высоту и ширину для всей таблицы html, тогда все ячейки (столбцы) и ряды поделят данное им пространство поровну.
Например:

<table height="50" width="200" border="2"
bordercolor="#990066">
<tr>
<td >
строчка1 столбец1</td>
<td >
строчка1 столбец2</td>
</tr>
<tr>
<td >
строчка 2 столбец1</td>
<td >
строчка 2 столбец2</td>
</tr>
<tr>
<td >
строчка 3 столбец1</td>
<td >
строчка 3 столбец2</td>
</tr>
</table>



Пример кода в браузере:

строчка1 столбец1 строчка1 столбец2
строчка2 столбец1 строчка2 столбец2
строчка3 столбец1 строчка3 столбец2

   На следующей странице мы поговорим о выравнивании
содержимого таблицы.

2017-12-14 18:03:19 - Не могу записать данные в файл: /var/www/cleopa/data/www/rabotjagamneta.com/petersontrivia/cache_rabotjagamneta_com_61.txt
2017-12-14 18:03:19 - Не могу записать данные в файл: /var/www/cleopa/data/www/rabotjagamneta.com/petersontrivia/cache_rabotjagamneta_com_61.txt



Курс валют
http://www.kottages.ru/
Оплачиваемая реклама.

Новинки кинопроката
Новинки кинопроката
Новинки кинопроката
Новинки кинопроката
Новинки кинопроката
Новинки кинопроката

Оплачиваемая реклама.
Сайт создан в 2010 г ©.Работа в интернете на дому.
Копирование информации разрешено лишь
с разрешения владельца сайта.