Powrót do strony głównej.

Powrót do moje lekcje programowania.

Sekcja 10 - Html|Tabele

Sekcja 10 - powrót.
Spis treści.

Lekcja 54. Jak stworzyć tabelę? - 28.05.2022

Spis treści.
Wykaz cen kursów
Nazwa Cena (zł) Ilość Producent Dodatek
HTML
CSS
                             
                                 <table border="1"> 
                                    <caption>Wykaz cen kursów</caption> 
                                    <thead> 
                                        <tr> 
                                            <th>Nazwa</th> 
                                            <th>Cena (zł)</th> 
                                            <th>Ilość</th> 
                                            <th>Producent</th> 
                                            <th>Dodatek</th> 
                                        </tr> 
                                    </thead> 
                                    <tbody> 
                                        <tr> 
                                            <td>HTML</td> 
                                            <td></td> 
                                            <td></td> 
                                            <td></td> 
                                            <td></td> 
                                        </tr> 
                                        <tr> 
                                            <td>CSS</td> 
                                            <td></td> 
                                            <td></td> 
                                            <td></td> 
                                            <td></td> 
                                        </tr> 
                                    </tbody> 
                                 </table>
                             
                         
table>(tr>td{Zawartość$}*5)*3
Zawartość1 Zawartość2 Zawartość3 Zawartość4 Zawartość5
Zawartość1 Zawartość2 Zawartość3 Zawartość4 Zawartość5
Zawartość1 Zawartość2 Zawartość3 Zawartość4 Zawartość5
                    
                        <table> 
                            <tr> 
                                <td>Zawartość1</td> 
                                <td>Zawartość2</td> 
                                <td>Zawartość3</td> 
                                <td>Zawartość4</td> 
                                <td>Zawartość5</td> 
                            </tr> 
                            <tr> 
                                <td>Zawartość1</td> 
                                <td>Zawartość2</td> 
                                <td>Zawartość3</td> 
                                <td>Zawartość4</td> 
                                <td>Zawartość5</td> 
                            </tr> 
                            <tr> 
                                <td>Zawartość1</td> 
                                <td>Zawartość2</td> 
                                <td>Zawartość3</td> 
                                <td>Zawartość4</td> 
                                <td>Zawartość5</td> 
                            </tr> 
                        </table> 
                    
                

Lekcja 55. Łączenie/rozciąganie komórek w tabelach (colspan/rowspan) - 29.05.2022

Spis treści.
Nazwa Cena(zł) Kategoria
C++ 49 Programowanie
PHP 39
Java 45
HTML 49 WWW
CSS 39
JavaScript 45
node.js 45
kursy w języku polskim
                            
                                <table border="2"> 
                                    <tr> 
                                        <th>Nazwa</th> 
                                        <th>Cena(zł)</th> 
                                        <th>Kategoria</th> 
                                    </tr> 
                                    <tr> 
                                        <td>C++</td> 
                                        <td>49</td> 
                                        <td rowspan="3">Programowanie</td> 
                                    </tr> 
                                    <tr> 
                                        <td>PHP</td> 
                                        <td>39</td> 
                                    </tr> 
                                    <tr> 
                                        <td>Java</td> 
                                        <td>45</td> 
                                    </tr> 
                                    <tr> 
                                        <td>HTML</td> 
                                        <td>49</td> 
                                        <td rowspan="4">WWW</td> 
                                    </tr> 
                                    <tr> 
                                        <td>CSS</td> 
                                        <td>39</td> 
                                    </tr> 
                                    <tr> 
                                        <td>JavaScript</td> 
                                        <td>45</td> 
                                    </tr> 
                                    <tr> 
                                        <td>node.js</td> 
                                        <td>45</td> 
                                    </tr> 
                                    <tr> 
                                        <td colspan="3" align="center">kursy w języku polskim</td> 
                                    </tr> 
                                </table>
                            
                        
Kategoria Nazwa Cena(zł)
Programowanie C++ 49
PHP 39
Java 45
WWW HTML 49
CSS 39
JavaScript 45
node.js 45
kursy w języku polskim
                            
                                <table border="2">
                                    <tr>
                                        <th>Kategoria</th>
                                        <th>Nazwa</th>
                                        <th>Cena(zł)</th>
                                    </tr>
                                    <tr>
                                        <td rowspan="3">Programowanie</td>
                                        <td>C++</td>
                                        <td>49</td>
                                    </tr>
                                    <tr>
                                        <td>PHP</td>
                                        <td>39</td>
                                    </tr>
                                    <tr>
                                        <td>Java</td>
                                        <td>45</td>
                                    </tr>
                                    <tr>
                                        <td rowspan="4">WWW</td>
                                        <td>HTML</td>
                                        <td>49</td>
                                    </tr>
                                    <tr>
                                        <td>CSS</td>
                                        <td>39</td>
                                    </tr>
                                    <tr>
                                        <td>JavaScript</td>
                                        <td>45</td>
                                    </tr>
                                    <tr>
                                        <td>node.js</td>
                                        <td>45</td>
                                    </tr>
                                    <tr>
                                        <td colspan="3" align="center">kursy w języku polskim</td>
                                    </tr>
                                </table>
                            
                        

Lekcja 56. Tabelki [LEKCJA archiwalna] - 30.05.2022 i

Spis treści.
Nazwa Cena(zł) Kategoria
C++ 49 Programowanie
PHP 39
Java 45
HTML 49 WWW
CSS 39
JavaScript 45
node.js 45
kursy w języku polskim
                            
                                <table border="2" cellpadding="10" cellspacing="0">
                                    <tr>
                                        <th>Nazwa</th>
                                        <th>Cena(zł)</th>
                                        <th>Kategoria</th>
                                    </tr>
                                    <tr>
                                        <td>C++</td>
                                        <td>49</td>
                                        <td rowspan="3">Programowanie</td>
                                    </tr>
                                    <tr>
                                        <td>PHP</td>
                                        <td>39</td>
                                    </tr>
                                    <tr>
                                        <td>Java</td>
                                        <td>45</td>
                                    </tr>
                                    <tr>
                                        <td>HTML</td>
                                        <td>49</td>
                                        <td rowspan="4">WWW</td>
                                    </tr>
                                    <r>
                                        <td>CSS</td>
                                        <td>39</td>
                                    </tr>
                                    <tr>
                                        <td>JavaScript&l/td>
                                        <td>45</td>
                                    </tr>
                                    <tr>
                                        <td>node.js</td>
                                        <d45</td>
                                    </tr>
                                    <tr>
                                        <td colspan="3" align="center">kursy w języku polskim</td>
                                    </tr>
                                </table>
                            
                        
Tabelka testowa
1 2 3
 
1 2 3
Ja jestem rozpięta na trzy komórki.
Informacja 1 Informacja 2 Informacja 3
Informacja 1 Informacja 3
Informacja 1 Informacja 3
                            
                                <table border="1 cellpadding="10" cellspacing="10" width="100%" height="1000">
                                    <caption>Tabelka testowa</caption>
                                    <thead height="100">
                                        <tr bgcolor="red">
                                            <th>1 </th>
                                            <th>2 </th>
                                            <th>3 </th>
                                        </tr>
                                    </thead>
                                    <tfoot bgcolor="green" height="100">
                                        <tr>
                                            <td colspan="3"> </td>
                                        </tr>
                                    </tfoot>
                                    <tbody bgcolor="gray">
                                        <tr>
                                            <td align="right">1 </td>
                                            <td align="center">2 </td>
                                            <td align="left">3 </td>
                                        </tr>
                                        <tr valign="top">
                                            <td colspan="3" valign="middle" align="middle">Ja jestem rozpięta na trzy komórki.</td>
                                        </tr>
                                        <tr>
                                            <td valign="top">Informacja 1 </td>
                                            <td valign="middle" rowspan="3">Informacja 2 </td>
                                            <td valign="bottom">Informacja 3 </td>
                                        </tr>
                                        <tr>
                                            <td valign="top">Informacja 1 </td>
                                            <td valign="bottom">Informacja 3 </td>
                                        </tr>
                                        <tr>
                                            <td valign="top">Informacja 1 </td>
                                            <td valign="bottom">Informacja 3 </td>
                                        </tr>
                                    </tbody>
                                </table>