CSS Таблиці
Зовнішній вигляд HTML таблиці можна значно покращити за допомогою CSS:
| Company | Contact | Country |
|---|---|---|
| Alfreds Futterkiste | Maria Anders | Germany |
| Berglunds snabbköp | Christina Berglund | Sweden |
| Centro comercial Moctezuma | Francisco Chang | Mexico |
| Ernst Handel | Roland Mendel | Austria |
| Island Trading | Helen Bennett | UK |
| Königlich Essen | Philip Cramer | Germany |
| Laughing Bacchus Winecellars | Yoshi Tannamuri | Canada |
| Magazzini Alimentari Riuniti | Giovanni Rovelli | Italy |
Спробуйте самі »
Межі таблиці
Щоб вказати межі таблиці в CSS, використовуйте властивість border.
В наведеному нижче прикладі вказана чорна межа для елементів <table>, <th> та <td>:
Таблиця на всю ширину
В деяких випадках наведена вище таблиця може здатися маленькою. Якщо вам потрібна таблиця, яка має заповнити весь екран (на всю ширину), додайте width: 100% до елементу <table>:
Подвійні межі
Зверніть увагу, що таблиця в наведених вище прикладах має подвійні межі. Це пов’язано з тим, що і таблиця, і елементи <th> та <td> мають окремі межі.
Щоб видалити подвійні межі, подивіться приклад нижче.
Згорнути межі таблиці
Властивість border-collapse визначає, чи повинні межі таблиці згортатися в одну межу:
Якщо вам потрібна лише межа навколо таблиці, вкажіть лише властивість border для <table>:
