Témakörök
 
Index

Mobil táblázat és karakterek megjelenése.

Táblázatok méretének, és a beírt adatok megjelenésének tesztelése.

Weboldal szélessége:
width: 940px; padding-left: 5px;


Kettő oszlopos táblázat, olvashatósági méretei.

table
{
width: 950px;
border 1px solid black;
}
caption{font-size:35pt;}
th{font-size:32pt;}
td{font-size:30pt;}

Kettő oszlopos táblázat.
1.Oszlop elnevezése2.Oszlop elnevezése
Adattároló cella.Adattároló cella.






További táblázatok tesztelése, mobilra.

Tabla mérete,
százalékban:
{
width: 100%;
border-collapse: separate;
border-spacing: 2px;
border: 2px solid black;
}

Tabla mérete, százalékban van meghatározva:
<th colspan="6"> .tabla100 {width: 100%; border-collapse: separate; border-spacing: 2px; border: 2px solid black;}
<td colspan="6"> .tabla100 td, th {font-family: Times New Roman; border: 1px solid yellow;}
td cella.td cella.td cella.td cella.td cella.td cella.


table{
width: 100%;
border-collapse: separate;
border-spacing: 2px;
border: 2px solid black;
}
table td, th {
font-family: Times New Roman;
border: 1px solid yellow;
}

.tabla100 {width: 100%; border-collapse: separate; border-spacing: 2px; border: 2px solid black;}
.tabla100 td, th {font-family: Times New Roman; border: 1px solid yellow;}
th cella.th cella.th cella.th cella.th cella.th cella.
td adat cella 01.td adat cella 02.td adat cella 03.td adat cella 04.td adat cella 05.td adat cella 06.
td cella.td cella.td cella.td cella.td cella.td cella.

 

Tabla mérete, px-ben van meghatározva:
table {
width: 800px;
border-collapse: separate;
border-spacing: 2px;
border: 2px solid black;
}

<th colspan="6"> .tabla800 {width: 800px; border-collapse: separate; border-spacing: 2px; border: 2px solid black;}
<td colspan="6"> .tabla800 td, th {font-family: Times New Roman; border: 1px solid yellow;}
td cella.td cella.td cella.td cella.td cella.td cella.

Tabla
width: 800px;
6 oszlop

.tabla800{width: 800px; border-collapse: separate; border-spacing: 2px; border: 2px solid black;}
.tabla800 td, th {font-family: Times New Roman; border: 1px solid yellow;}

th cella.th cella.th cella.th cella.th cella.th cella.
td adat cella 01.td adat cella 02.td adat cella 03.td adat cella 04.td adat cella 05.td adat cella 06.
td cella.td cella.td cella.td cella.td cella.td cella.

 

Tabla
width: 800px;
1 oszlop

Betűk mérete
Méret: 12px
Méret: 13px
Méret: 14px
Méret: 15px
Méret: 16px
Méret: 17px
Méret: 18px
Méret: 19px
Méret: 20px
Méret: 21px
Méret: 22px
Méret: 23px
Méret: 24px
Méret: 25px
Méret: 26px
Méret: 27px
Méret: 28px
Méret: 29px
Méret: 30px

 

Tabla
width: 800px;
2 oszlop

KarakterekBetűk mérete
Szöveg M B Méret: 12px
Szöveg M B Méret: 13px
Szöveg M B Méret: 14px
Szöveg M B Méret: 15px
Szöveg M B Méret: 16px
Szöveg M B Méret: 17px
Szöveg M B Méret: 18px
Szöveg M B Méret: 19px
Szöveg M B Méret: 20px
Szöveg M B Méret: 21px
Szöveg M B Méret: 22px
Szöveg M B Méret: 23px
Szöveg M B Méret: 24px
Szöveg M B Méret: 25px
Szöveg M B Méret: 26px
Szöveg M B Méret: 27px
Szöveg M B Méret: 28px
Szöveg M B Méret: 29px
Szöveg M B Méret: 30px

 

Tabla
width: 800px;
3 oszlop

KarakterekBetűk méreteSzámok
Szöveg M B Méret: 12px12345
Szöveg M B Méret: 13px12345
Szöveg M B Méret: 14px12345
Szöveg M B Méret: 15px12345
Szöveg M B Méret: 16px12345
Szöveg M B Méret: 17px12345
Szöveg M B Méret: 18px12345
Szöveg M B Méret: 19px12345
Szöveg M B Méret: 20px12345
Szöveg M B Méret: 21px12345
Szöveg M B Méret: 22px12345
Szöveg M B Méret: 23px12345
Szöveg M B Méret: 24px12345
Szöveg M B Méret: 25px12345
Szöveg M B Méret: 26px12345
Szöveg M B Méret: 27px12345
Szöveg M B Méret: 28px12345
Szöveg M B Méret: 29px12345
Szöveg M B Méret: 30px12345

 

Táblázatoknál:
Betűk méretét, az oszlopok száma is befolyásolja.
Táblázat minél több oszlopot tartalmaz, annál kisebb betűk lesznek, és mobilon nagyítás nélkül a tartalma, olvashatatlan lesz.

 

 

Vissza a lap elejére