<!-->
<!DOCTYPE>
<a>
<abbr>
<acronym>
<address>
<applet>
<area>
<article> (HTML5)
<aside>(HTML5)
<audio> (HTML5)
<b>
<base>
<basefont>
<bdo>
<big>
<blockquote>
<body>
<br>
<button>
<canvas> (HTML5)
<caption>
<center>
<cite>
<code>
<col>
<colgroup>
<command> (HTML5)
<datalist> (HTML5)
<dd>
<del>
<details> (HTML5)
<dfn>
<dir>
<div>
<dl>
<dt>
<em>
<embed> (HTML5)
<fieldset>
<figcaption> (HTML5)
<figure> (HTML5)
<font>
<footer> (HTML5)
<form>
<frame>
<frameset>
<h1> - <h6>
<head>
<header> (HTML5)
<hgroup> (HTML5)
<hr>
<html>
<i>
<iframe>
<img>
<input>
<ins>
<keygen> (HTML5)
<kbd>
<label>
<legend>
<li>
<link>
<map>
<mark> (HTML5)
<menu>
<meta>
<meter> (HTML5)
<nav> (HTML5)
<noframes>
<noscript>
<object>
<ol>
<optgroup>
<option>
<output> (HTML5)
<p>
<param>
<pre>
<progress> (HTML5)
<q>
<rp> (HTML5)
<rt> (HTML5)
<ruby> (HTML5)
<s>
<samp>
<script>
<section> (HTML5)
<select>
<small>
<source> (HTML5)
<span>
<strike>
<strong>
<style>
<sub>
<summary> (HTML5)
<sup>
<table>
<tbody>
<td>
<textarea>
<tfoot>
<th>
<thead>
<time> (HTML5)
<title>
<tr>
<tt>
<u>
<ul>
<var>
<video> (HTML5)
<wbr> (HTML5)
Η ετικέτα <table>
Ορισμός και χρήση
Με την ετικέτα <table> εισάγουμε έναν πίνακα στην σελίδα μας.
Ετικέτα τέλους: </table>

Περισσότερα για τους πίνακες
Παράδειγμα
Πηγαίος Κώδικας Αποτέλεσμα στον browser
<table style=" border: thin solid red">
<tr>
<td>γραμμή 1, στήλη 1</td>
<td>γραμμή 1, στήλη 2</td>
</tr>
<tr>
<td>γραμμή 2, στήλη 1</td>
<td>γραμμή 2, στήλη 2</td>
</tr>
</table>
γραμμή 1, στήλη 1 γραμμή 1, στήλη 2
γραμμή 2, στήλη 1 γραμμή 2, στήλη 2
Διαφορές στην χρήση μεταξύ της HTML4.01 και την HTML5
Από όλες τις ιδιότητες που υποστήριζε η HTML 4.01, μόνο η summary συμπεριελαμβάνεται στην HTML5
Ιδιότητες
Ιδιότητα Τιμή Περιγραφή
align left
center
right
ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει την στοίχιση του πίνακα μέσα στην σελίδα
bgcolor rgb(x,x,x)
#xxxxxx
colorname
Περισσότερα για τα χρώματα
ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει το χρώμα το φόντου του πίνακα
border αριθμός ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει το πάχος του περιγράμματος του πίνακα.
cellpadding pixels
%
ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει το μέγεθος του κενού χώρου μεταξύ του πλαισίου των κελιών και του περιεχομένου αυτών
cellspacing pixels
%
ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει το πάχος των σκιασμένων γραμμών που διαχωρίζουν τα κελιά
frame void
above
below
hsides
lhs
rhs
vsides
box
border
ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει την εμφάνιση του εξωτερικού πλαισίου του πίνακα.
rules none
groups
rows
cols
all
ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει την εμφάνιση των γραμμών που χωρίζουν τα κελιά μέσα στον πίνακα
summary κείμενο Ορίζει μια περιγραφή για τον πίνακα
width pixels
%
ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει το μήκος του πίνακα
Κοινές (standard) ιδιότητες που μπορεί να πάρει η ετικέτα:
Η ετικέτα <table> υποστηρίζει τις standard ιδιότητες της HTML5
HTML Γεγονότα που μπορεί να πάρει η ετικέτα:
Η ετικέτα <table> υποστηρίζει τις ιδιότητες events της HTML5
Δοκίμασε το
Πίνακες
Πώς εισάγουμε πίνακες στην σελίδα μας
Επικεφαλίδες σε πίνακα
Με την ετικέτα <th> εισάγουμε επικεφαλίδες σε έναν πίνακα
Λεζάντα σε πίνακα
Με την ετικέτα <caption> εισάγουμε λεζάντα σε έναν πίνακα
Περίγραμμα σε πίνακα
Με την ιδιότητα border της ετικέτας <table> ορίζουμε περίγραμμα σε έναν πίνακα
Μήκος και ύψος ενός πίνακα
Με την ιδιότητα width ορίζουμε το μήκος του πίνακα, ενώ με την height το ύψος του. Οι δύο ιδιότητες αυτές μπορούν να μπουν και στην <tr> και στην <td>. Είναι προτιμότερο και συνηθέστερο να ορίζουμε το μήκος και το ύψος των κελιών και όχι του συνολικού πίνακα