☰

» »

Tabela brez zunanjih robov

Tabela brez zunanjih robov

Penny ::

Kako narediti tabelo ki ne prikazuje zunanjih robov, se pravi če imam tabelo z dvema vrsticama in dvema kolonama mi prikazuje samo križ?
Tenks!! LP
  • spremenil: Penny ()

Penny ::

nekaj sem sicer ugotovil in sicer

table frame="void"

tole odstrani zunanji rob table ampak ne vem zakaj deluje samo v IE v firefoxu pa ne
Tenks!! LP

R33D3M33R ::

To je zato, ker je to očitno IE-only funkcija. Teh se izogibaj, ker izdelava take IE-only strani nima smisla.

Rešitev tvoje težave je CSS:

<style>
table {
border:0;
width:200px;
height:200px;
}
td.prva {
border-bottom: 1px solid black;
border-right: 1px solid black;
}
td.druga {
border-bottom: 1px solid black;
border-left: 1px solid black;
}
td.tretja {
border-top: 1px solid black;
border-right: 1px solid black;
}
td.cetrta {
border-top: 1px solid black;
border-left: 1px solid black;
}
</style>
<table cellspacing="0" cellpadding="0">
<tr><td class="prva">&nbsp;</td><td class="druga">&nbsp;</td></tr>
<tr><td class="tretja">&nbsp;</td><td class="cetrta">&nbsp;</td></tr>
</table>


Malo se poigraj, priporočal bi ti tudi, da shraniš CSS v zunanjo CSS datoteko.
Moja domača stran: http://andrej.mernik.eu
Na spletu že od junija 2002 ;)
:(){ :|:& };:

Penny ::

Ja tole dela odlično, sam jaz to ne morem uporabit, ker imam kodo pomešano z php in je število vrstic odvisnko kok določiš v administraciji
takole zgleda cleotna koda:

Bom kr sliko prlepo ko ne gre kode.



Pač gre se za izdelke v virtuemart, določene imam skupaj 4 izdelke. Dva po dve vrstici. Tale koda mi zdaj pač prikazuje tabelo štirih produktov. Jaz bi pač rad imel med njimi samo križ, brez zunanjih robov.
Tenks!! LP

Zgodovina sprememb…

  • spremenil: Penny ()

Binji ::

redeemer zakaj pa eksplicitno omejujes velikost tabele?

napisi tkole:
(table class="tabela")
(tr)
(td)(/td)....
(/tr)
(tr)
(td)(/td)....
(/tr)
(/table)

v CSS pa

.tabela{
border:none;
}

ce pa hoces robove celic pa nardis se

.tabela td{
border: #000000 solid 1px; (recimo)
}

namesto navadnih oklepajev so seveda oglati

edit: ups zdaj sm opazu, da sm povrsno preletel prvi post... no potem lahko uporabis redeemerjevo resitev za prvo in zadnjo vrstico, za vse vmes pa naredis spet ustrezen CSS class td-jev
Kdor ne navija ni Slovenc, hej, hej, hej!

Zgodovina sprememb…

  • spremenil: Binji ()

R33D3M33R ::

Binji: celotno kodo sem prilepil iz HTML datoteke, kjer sem kodo testiral. Ker se brez velikosti nič ne vidi, sem bil primoran uporabiti še dimenzije. Med lepljenjem sem pa to očitno pozabil odstraniti.

Penny: nič hudega. Pač v PHP kodi še malo poračunaš, da dobiš ravno pravi class. 

<style>
table {
border:0;
}
td {
border:1px solid black;
}
td.prva_l {
border-top:0;
border-left:0;
}
td.prva_d {
border-top:0;
border-right:0;
}
td.zadnja_l {
border-bottom:0;
border-left:0;
}
td.zadnja_d {
border-bottom:0;
border-right:0;
}
td.vmes_z {
border-top: 0;
}
td.vmes_l {
border-left: 0;
}
td.vmes_d {
border-right:0;
}
td.vmes_s {
border-bottom: 0;
}
</style>
<table cellspacing="0" cellpadding="0">
<tr><td class="prva_l">&nbsp;</td><td class="vmes_z">&nbsp;</td><td class="vmes_z">&nbsp;</td> ... <td class="prva_d">&nbsp;</td></tr>
<tr><td class="vmes_l">&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td> ... <td class="vmes_d">&nbsp;</td></tr>
.
.
.
.
<tr><td class="zadnja_l">&nbsp;</td><td class="vmes_s">&nbsp;</td><td class="vmes_s">&nbsp;</td> ... <td class="zadnja_d">&nbsp;</td></tr>
</table>


P.S: za lepljenje kode uporabita [st.koda][/st.koda]
Moja domača stran: http://andrej.mernik.eu
Na spletu že od junija 2002 ;)
:(){ :|:& };:

Zgodovina sprememb…

mte ::

Reedemer: po nepotrebnem večaš velikost datotek, pri veliki tabeli se to hitro pozna, pa še nepregledno postane.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html lang="sl">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>untitled</title>
  <!-- Date: 2008-02-29 -->
  <style type="text/css" media="screen">
    table {
      border-collapse: collapse;
    }
    td {
      border-bottom: 1px solid black;
      border-right: 1px solid black;
    }
    .last td {
      border-bottom: none;
    }
    td.last {
      border-right: none;
    }
  </style>
</head>
<body>

  <table>
    <tr>
      <td>a</td><td>b</td><td class="last">c</td>
    </tr>
    <tr>
      <td>a</td><td>b</td><td class="last">c</td>
    </tr>
    <tr class="last">
      <td>a</td><td>b</td><td class="last">c</td>
    </tr>
  </table>

</body>
</html>

R33D3M33R ::

Kakorkoli že... to je bil le moj predlog :P

Sicer pa bi tudi ti lahko namesto none uporabil 0 in prišparal tistih par byte-ov ;)
Moja domača stran: http://andrej.mernik.eu
Na spletu že od junija 2002 ;)
:(){ :|:& };:

mte ::

R33D33M33R: no, tako picajzlast pa spet ni treba bit... ti govoriš o par bajtih, jaz sem govoril kar nekaj kilobajtih. Drugače pa prav, da si nekaj predlagal, jaz sem predlog samo nadgradil. Seveda mogoče obstaja tudi boljša varianta od moje.

lp

veteran ::

No, če že picajzlamo, potem se tole:

td {
border-bottom: 1px solid black;
border-right: 1px solid black;
}

skrajša v:

td {
border: 1px solid #000;
border-width:0 1px 1px 0;
}

Resda gre tule za nekaj bytov, se pa krepko pozna, če paziš tako v html kot css. Marsikdo po nepotrebnem štepa class-e za vsako celico, in če ima potem tabela npr sto vrstic, ne bo samo par bytov.

Vredno ogleda ...

TemaSporočilaOglediZadnje sporočilo
TemaSporočilaOglediZadnje sporočilo
!

Vse, kar ste si želeli vprašati o CSS, pa si niste upali. (strani: 1 2 3 4 … 23 24 25 26 )

Oddelek: Izdelava spletišč		1298345846 (4983) sunniegoldie
»

Prikaz strani na različni resoluciji-Joomla

Oddelek: Izdelava spletišč		151935 (1663) kr?en
»

Ocena? Kako bi dodal podstrani?

Oddelek: Pomoč in nasveti		6899 (764) shadeX
»

Wampserver in Firefox

Oddelek: Izdelava spletišč		61845 (1725) jonystar
»

3 divi v divu in float

Oddelek: Izdelava spletišč		101746 (1630) alexa-lol

Več podobnih tem