Помощь с таблицами HTML

1. основы
2. Примеры
3. Пример 2
4. Пример 3
5. Пример 4
6. Пример 5

Обновлено: 21.05.2008 от Computer Hope

основы

Таблицы используются для организации данных в столбцах и строках, как в электронной таблице. Например, рассмотрим, как организована информация в таблице ниже:

Приведенный выше график был создан с использованием следующего исходного кода.

Что все это значит?

<table style = "border: 1px solid black"> Размер границы ( 1 пиксель ), стиль линии ( сплошной ) и цвет ( черный ).
<tr> Начните первый ряд.
<td> <b> HITS </ b> </ td> Оператор <td> должен начинать первый столбец, а </ td> - конец первого столбца. Заявление b делает текст жирным. То же самое относится и к следующим двум строкам.
</ tr> Заканчивает первый ряд.
Следующие три строки похожи на то, что было объяснено выше.
<td style = "text-align:" center "> - </ td> Аналогично предыдущему td за исключением того, что содержимое центрировано.
Следующие шесть строк похожи на то, что было объяснено выше.

</ table> Заканчивает таблицу без преобразования оставшейся части документа в таблицу.

Примеры

Пример 1

<table border = "0" Этот оператор сообщает браузеру, что он не хочет границу, объявив border = "0".
<td style = "background-color: # FFFF00"> 1 </ td> Td объявляет новую ячейку, как объяснено в основы , Style = "background-color: # FFFF00" сообщает браузеру, какой цвет для отображения ячейки; в этом случае # FFFF00 будет желтым; Вы также можете просто написать желтым. Для больше на цветах, посмотрите наш цветовые коды стр.

Пример 2

Приведенное выше изображение представляет собой три разных изображения, помещенных в таблицу, которая находится на 100% части экрана. Ниже приведен исходный код, использованный для приведенного выше примера.

<table border = "0" style = "width: 100%"> Наиболее важной частью вышеприведенного является первая строка с style = "width: 100%." Стиль сообщает браузеру, что таблица должна быть на 100% открытого экрана или содержаться независимо от размера или разрешения экрана посетителей.

Пример 3

Добро пожаловать в Компьютер Надежда один из самых современных бесплатных веб-сайтов в Интернете, который поможет вам решить все ваши проблемы с компьютером. Помогает вам в таких темах, как HTML, где мы приводим примеры, исходный код, улучшения, советы и многое другое. Помочь вам с аппаратные средства вопросы с сотнями технических страниц полезной информации с таким оборудованием, как принтеры , сканеры , звуковые карты , модемы , Компакт-диски , и многое другое. Помочь вам с программного обеспечения вопросы с такими приложениями как DOS , Windows 95 , Windows 3.x , Юникс , саман Фотошоп и многое другое. Помочь вам с игры , предоставляя читы для множества игр, совершая прорывы, предоставляя пошаговые инструкции по покорению вашей любимой игры, игровые новости и многое другое. Более 10000 страниц бесплатной, часто обновляемой информации у вас под рукой и все благодаря Computer Hope.

Этот вопрос часто задают, когда кто-то хочет разместить изображения и текст рядом друг с другом, чтобы они выглядели как новостная газета. Приведенный ниже исходный код показывает, как мы сделали выше. Мы сократили наше заявление, чтобы оно выглядело менее пугающим.

<td style = "vertical-align: top"> ЗАЯВЛЕНИЕ, ВЫЯВЛЕННОЕ ВЫШЕ </ td> Самая важная строка этого кода style = "vertical-align: top" говорит браузеру выравнивать начало текста сверху изображения. Свойство вертикального выравнивания также может быть одним из: среднего , нижнего , верхнего текста, нижнего текста , базовой линии , суб , супер и нескольких других.

Пример 4

<table style = "border: 10px solid grey"> Этот простой эффект контура создается путем указания границы стиля : "10px solid grey" . Ширина границы составляет десять пикселей, она окрашена в серый цвет.

Пример 5

СТРАНИЦА ИНТЕРНЕТА

ОПИСАНИЕ

ХИТЫ

МЕСЯЦ

Дополнительная информация

Похожие