Частина інформації на веб-сайті частовідображається в табличній формі. Таблиця - це табличні дані у вигляді сітки, що складається з стовпців, рядків та комірок, яка є зустріччю між стовпцями та рядками. Використання таблиць, безумовно, робить інформацію більш короткою та стислою та полегшує людям читання та розуміння інформації, що міститься в них. Крім того, відображення даних, взятих із бази даних, буде легше читати та зручно бачити, якщо ви використовуєте таблицю.

Переконайтеся в корисності таблиці, звичайноВи також повинні навчитися створювати таблиці в HTML. Тому в цьому обговоренні я обговорюю матеріал про те, як створити таблиці в HTML. Ви можете створювати таблиці в HTML-документах, використовуючи спеціальні теги, надані HTML, що починається з <tag> пари тегів ……. </table>.

Використання таблиць у документах HTML невірноВи використовуєте для проектування компонування елементів у таблиці, іншими словами, він не повинен використовуватися для макетів сторінок. Раніше він часто використовувався для проектування зовнішнього вигляду веб-сайту, але тепер його функцію замінює CSS, що набагато краще з точки зору того, щоб зробити веб-сайт виглядом.

Загальні теги, надані HTML для створення таблиці, включають:

Тег Функція
стіл використовується для визначення таблиці, де таблиця знаходиться в HTML.
тр є продовженням рядка таблиці, який використовується для визначення рядків у таблиці.
го є розширенням заголовка таблицівикористовується для визначення заголовків комірок у таблиці, що знаходиться в самому верхньому або крайньому лівому куті таблиці. Заголовок таблиці вгорі - це заголовок стовпця таблиці, тоді як заголовок таблиці зліва - заголовок рядка таблиці.
тд є продовженням таблиці даних, яка використовується для визначення вмісту кожної комірки таблиці.

Таблиця в HTML починається з використання тегу <table> і закінчується тегом </table>. Між парами тегів <table> ... </tabel> тег <tr> пишеться для створення рядка в таблиці.

Далі, у кожній парі тегів <tr>... </tr>, написані в ньому стовпці використовують тег <th> для створення заголовка (батьківської комірки) або <td> тега для створення вмісту кожної комірки в таблиці. Далі наведено простий зразок коду для створення таблиці в HTML:

<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Tabel di HTML</title>
</head>
<body>
<table>
<tr>
<th>Nama</th>
<th>Jurusan</th>
<th>Kelas</th>
</tr>
<tr>
<td>Muhammad Ridho</td>
<td>TKJ</td>
<td>12</td>
</tr>
<tr>
<td>Meilisa Niatur Rahmah</td>
<td>MM</td>
<td>11</td>
</tr>
<td>Johanes Eko Prasetyo</td>
<td>RPL</td>
<td>10</td>
</tr>
</table>
</body>
</html>

Якщо він працює в браузері, це виглядає приблизно так:

проста таблиця без меж

Можливо, вам цікаво, чому стіл - німає маржину, як та, що знаходиться в таблиці "Ексель". Це тому, що в таблиці немає рамки (рамка / рамка). Ви можете використовувати атрибут border для надання таблиці таблиці, наприклад, такий HTML-код:

<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Tabel di HTML</title>
</head>
<body>
<table border="1">
<tr>
<th>Nama</th>
<th>Jurusan</th>
<th>Kelas</th>
</tr>
<tr>
<td>Muhammad Ridho</td>
<td>TKJ</td>
<td>12</td>
</tr>
<tr>
<td>Meilisa Niatur Rahmah</td>
<td>MM</td>
<td>11</td>
</tr>
<tr>
<td>Johanes Eko Prasetyo</td>
<td>RPL</td>
<td>10</td>
</tr>
</table>
</body>
</html>

Результати в такому браузері:

проста таблиця з кордоном

На малюнку вище я надаю атрибутмежа зі значенням "1", тому таблиця має поле в 1 піксель. Якщо він не записаний, то таблиця не має поля. Ще одне питання, яке часто ставиться під сумнів, - це різниця між тегом <th> і тегом <td>.

З пояснення вище також пояснили, що тег<th> використовується для визначення заголовка (батьківської комірки) для кожного стовпця або рядка, який зазвичай позначений жирними літерами в середині, як текст Ім'я, Майори, і Клас. Тоді як тег <td> визначає лише дані в кожній комірці таблиці, які позначені нормальною формою літер, а за замовчуванням вирівнюється ліворуч.

Далі вам потрібно вивчити наступний матеріал (все-таки про таблиці HTML), який стосується поєднання таблиць у HTML.

</p>
</p>

</article>
Коментарі 0
</main>
</div>