Nové výhodné předplatné namísto kreditů je tu! Více informací. Upravili jsme také naše provozní podmínky.
NOVINKA: Staň se datovým analytikem a získej jistotu práce, lepší plat a nové kariérní možnosti. Více informací:
Avatar
Ondřej Nováček
Člen
Avatar
Ondřej Nováček:22.4.2016 13:57

Ahojky.
Chtěl bych se zeptat jak mám HTML vycentrovat tabulku a jak v něm označit sloupec (tagem).
Díky.

 
Odpovědět
22.4.2016 13:57
Avatar
Noko
Tvůrce
Avatar
Noko:22.4.2016 14:35

Ahoj,
tabulku vycentruješ tak, že tagu <table> přidáš align="center", takže

<table align="center">

A to s tím označeným sloupcem nechápu.

 
Nahoru Odpovědět
22.4.2016 14:35
Avatar
Tomáš123
Člen
Avatar
Odpovídá na Noko
Tomáš123:23.4.2016 18:00

Tabuľku ide centrovať aj pomocou margin: auto v CSS. Atribútov určujúcich vzhľad by sa v HTML malo vyskytovať čo najmenej.

Nahoru Odpovědět
23.4.2016 18:00
Keby nebolo Internetu Exploreru, nebolo by dnešného internetu.
Avatar
Noko
Tvůrce
Avatar
Odpovídá na Tomáš123
Noko:23.4.2016 20:16

Já si taky myslím že vzhled by se měl určovat v CSS, margin: auto bych použil kdyby používal centrovanou tabulku často, nebo nedejbože tabulkový layout. Zato když použije tabulku jen občas tak podle mě align="center" nijak moc nevadí.
(Něco jiného je <center> ten jsem dříve používal a dodnes se za to stydím)

 
Nahoru Odpovědět
23.4.2016 20:16
Avatar
Tomáš123
Člen
Avatar
Odpovídá na Noko
Tomáš123:24.4.2016 16:16

Ono ide práve o snahu oddeliť vzhľad od obsahu. Neformálne a prakticky je tvoje riešenie pre jeden prvok rovnako funkčné ako použitie marginu.

Za čistejšie riešenie ale považujem nastaviť triedu a požadované vlastnosti deklarovať v CSS. Triedu môžeš neskôr nastaviť aj iným tabuľkám (či prvkom) a v prípade potreby vzhľad zmeniť na jednom riadku v CSS.

Formálne je atribút align zastaraný rovnako ako značka <center>.

Nahoru Odpovědět
24.4.2016 16:16
Keby nebolo Internetu Exploreru, nebolo by dnešného internetu.
Avatar
Noko
Tvůrce
Avatar
Odpovídá na Tomáš123
Noko:24.4.2016 18:44

Máš pravdu, můj problém je v tom, že když jsem se učil HTML tak jsem byl líný naučit se CSS a některé špatné zvyky mi zůstaly.

 
Nahoru Odpovědět
24.4.2016 18:44
Avatar
Václav Černý
Člen
Avatar
Václav Černý:24.4.2016 19:27

Pro vycentrování tabulky určitě použij CSS. Nejjednodušší způsob je použití vlastnosti margin a nastavení odsazení levého a pravého okraje na stejné automatické hodnoty.

table {
  margin: 0px auto;
}

Pro podporu starších prohlížečů je nutné, jak bývá zvykem, si pomoci vlastností text-align.

.centered {
  text-align: center;
}

table {
  margin: 0px auto;
  text-align: left;
}

<div class="centered">
  <table>
        ...
  </table>
</div>

Popřípadě můžeš div s třídou centered vynechat a vlastnost text-align použít na tag body.

Pokud chceš, aby se šířka tabulky procentuálně přizpůsobovala, řešení by mohlo být následující.

table {
  width: 80%;
  margin: 0% 10%;
}

A označit sloupec můžeš jednoduchým selektorem. Dá se říci, že jednička v tomto případě značí číslo sloupce.

table tr td:nth-child(1) {
  ...
}
Editováno
Nahoru Odpovědět
24.4.2016 19:27
Nezávislý český vývojářský tým - www.luvastudio.cz
Avatar
Václav Černý
Člen
Avatar
Václav Černý:24.4.2016 19:35

Ještě bych doplnil, že pokud se jedná o vycentrování tabulky v HTML e-mailu, je použití atributu align="center" na místě.

Nahoru Odpovědět
24.4.2016 19:35
Nezávislý český vývojářský tým - www.luvastudio.cz
Avatar
Ondřej Nováček
Člen
Avatar
Ondřej Nováček:24.4.2016 19:38

Za všechno díky. Ten sloupec bych chtěl oznacit nějakým tagem, třeba jako se označuje článek article atd.

 
Nahoru Odpovědět
24.4.2016 19:38
Avatar
Tomáš123
Člen
Avatar
Odpovídá na Ondřej Nováček
Tomáš123:24.4.2016 20:10

Existuje HTML značka <col> (http://jecas.cz/html-tabulky#col). Nejde ňou ale meniť každý aspekt vzhľadu... Na djpw sa to nedávno riešilo (http://diskuse.jakpsatweb.cz/?…).

V prípade potreby obšírnejšieho štýlovania ide konkrétny stĺpec zamerať cez selektor priameho súrodenca. V prípade, že tabuľka obsahuje aj pospájané bunky môže byť celkom oriešok zamerať požadovaný stĺpec v každom riadku...

Nahoru Odpovědět
24.4.2016 20:10
Keby nebolo Internetu Exploreru, nebolo by dnešného internetu.
Avatar
Václav Černý
Člen
Avatar
Odpovídá na Ondřej Nováček
Václav Černý:24.4.2016 20:11

Sloupec žádným tagem neoznačíš. Můžeš tak maximálně označit příslušné buňky atributem class, respektive přidat jim třídu a tím budeš mít dá se říci označený sloupec. Jinak to nejde a jinak to ani není potřeba.

Editováno
Nahoru Odpovědět
24.4.2016 20:11
Nezávislý český vývojářský tým - www.luvastudio.cz
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 11 zpráv z 11.