HTML5 + CSS3 logó
  WEBFEJLESZTÉS, WEBÁRUHÁZ KÉSZÍTÉS   Ingyenes elektronikus tananyag interaktív
weboldalak készítéséhez.
Custom Search
 
vissza VISSZA    
menü MENÜ    
ismét ISMÉT    
tovább TOVÁBB    

Táblaszegélyek összevonása-elválasztása



A border-collapse ( szegélyek összevonása ) tulajdonsággal a táblázat egyes elemeinek körvonalai elválaszthatók vagy összevonhatók.

Lehetséges értékei:
collapse = összevonva
separate = elválasztva

A szegélyek összevonása-elválasztása :

kijelölő
{
border-collapse
:
kulcsszó;
}


Példa összevonásra:

Forráskód



<style>
  table, th, td
    {border: 1px solid green; }  
  table
    {border-collapse:collapse;} 
</style>     
...
<body>
  <table>
  <tr>
    <td> 1. sor és 1. oszlop </td>
    <td> 1. sor és 2. oszlop </td>
  </tr>
  <tr>
    <td> 2. sor és 1. oszlop </td>
    <td> 2. sor és 2. oszlop </td>
  </tr>
  </table>   
</body>
 

Eredmény*

* Az eredmény megjelenítése az Ön által használt böngészőtől függ.

Példa szétválasztásra:

Forráskód



<style>
  table, th, td
    {border: 1px solid green; }  
  table
    {border-collapse:separate;} 
</style>     
...
<body>
  <table>
  <tr>
    <td> 1. sor és 1. oszlop </td>
    <td> 1. sor és 2. oszlop </td>
  </tr>
  <tr>
    <td> 2. sor és 1. oszlop </td>
    <td> 2. sor és 2. oszlop </td>
  </tr>
  </table>   
</body>
 

Eredmény*


* Az eredmény megjelenítése az Ön által használt böngészőtől függ.
A példakód külön ablakban is megtekinthető: css_tablazat_szegely_osszevon.html ; css_tablazat_szegely_elvalaszt.html