Jak na tenké orámování tabulky 1.
Zkušení tvůrci www stránek, kteří používají při své práci tabulky, se již zcela jistě setkali s nepříjemným faktem – pokud totiž zadají orámování tabulky border=“1″, výsledná čára kolem tabulky nemá tlouštku jeden pixel, ale pixely dva.
Zde je příklad jednoduché tabulky o jedné buňce (řádku), která má nastaveno orámování border=“1″ a kde je zvolena barva orámování jako černá.
|

Příklad:
Text v tabulce |
Pokud bychom nyní orámování výše uvedené tabulky změřili – například pomocí nějakého grafického programu, zjistíme, že orámování není jeden pixel, jak by mělo být (border=“1″), ale pixely dva. Abych byl upřímný, nevím, proč tomu tak je, ale dám vám hned tip, jak dosáhnout orámování tabulky, které bude mít skutečně jeden pixel.
Abychom toho dosáhli, musíte tabulku, kterou chce orámovat, vnořit ještě do jedné tabulky, která bude mít nastaven cellpadding=“1″ (okraj mezi buňkou a obsahem buňky) a černé pozadí (pro černé orámování). Ve vnořené tabulce poté nastavte nějakou barvu pozadí, v tomto případě modrou (bgcolor=“#99CCFF“). Třeba takto:
|

Příklad:
|
Dosáhli jsme vlastně toho, že nadřazenou tabulku, která má černé pozadí, jsme překryli tabulkou, která má modré pozadí. V tabulce s černým pozadím je nastaven cellpadding=“1″, který odsadí vnořenou modrou tabulku ze všech stran o právě jeden pixel a vytvoří tak ono jednopixelové orámování. Pokud by jste potřebovali orámování 3 pixely, stačí nastavit v nadřazené tabulce cellpadding=“3″. Tento způsob má navíc tu výhodu, že barva orámování bude i v Netscape Navigatoru – který má sklon přidávat k barvě orámování tabulky ještě šedý stín, který nejde odstranit – stejná.
Tento jednoduchý trik ohledně tenkého orámování tabulky se bohužel nedá použít pokaždé. Pokud máte například tabulku, která má dva řádky a chcete ji orámovat (tedy včetně řádků), nepůjde to jinak jinak než pomocí border=“1″. Pak se musíte smířit s dva pixely tlustou čárou…
Starší komentáře ke článku
Pokud máte zájem o starší komentáře k tomuto článku, naleznete je zde.
Mohlo by vás také zajímat
-
-
Souboj na trhu s CPU pro servery: AMD vs. Intel
8. prosince 2023 -
Umělá inteligence: Co je to GPT?
12. května 2025 -
Gaming na HDR monitoru: Stojí to za to?
12. srpna 2024
Nejnovější
-
Zoner Photo Studio X se mění na Zoner Studio
13. června 2025 -
Co je to transformer v umělé inteligenci (AI)
10. června 2025 -
INNOCN monitory: špičková kvalita za zlomek ceny
5. června 2025 -
20 let Ubuntu: Cesta od revoluce k digitální každodennosti
30. května 2025