Come rimuovere td border con html?

html confini uscitaCome rimuovere td border con html?

<table border="1"> 
    <tr> 
    <td>one</td> 
    <td>two</td> 
    </tr> 
    <tr> 
    <td>one</td> 
    <td>two</td> 
</tr> 
</table>

questo sarà come questo

+---+---+ 
| | | 
+---+---+ 
| | | 
+---+---+

Ma vorrei per visualizzare il bordo nella tabella solo di non td come questo

+--------+ 
|  | 
|  | 
|  | 
+--------+

Come posso fare solo con markup html. (NO CSS/NO stili inline)

In alcuni casi ho bisogno di rimuovere solo alcuni confini td e un po 'di frontiera td per visualizzare qualcosa di simile:

+---+---+ 
| | | 
+---+ | 
| | | 
+---+---+

fonte

2013-09-04 Bhojendra Nepal

Devi usare i CSS. se non vuoi usare un foglio di stile separato. puoi usare l'attributo style nel tuo markup html. –

Non capisco perché non si voglia usare il CSS. Tutto quello che vuoi ottenere è molto semplice quando usi CSS: http://jsfiddle.net/K8hje/ – Jojo

circondano con un div e dare un bordo e rimuovere il bordo dalla tabella

<div style="border: 1px solid black"> 
    <table border="0"> 
     <tr> 
      <td>one</td> 
      <td>two</td> 
     </tr> 
     <tr> 
      <td>one</td> 
      <td>two</td> 
     </tr> 
    </table> 
</div>

È possibile controllare il working fiddle here

Come da domanda aggiornata .... dove si desidera aggiungere o rimuovere i bordi. Si dovrebbe rimuovere i bordi dalla tabella HTML e poi effettuare le seguenti operazioni

<td style="border-top: 1px solid black">

Assumendo come si desidera solo il bordo superiore. Allo stesso modo devi fare per gli altri. Modo migliore per creare quattro classi css ...

.topBorderOnly { 
    border-top: 1px solid black; 
} 

.bottomBorderOnly { 
    border-bottom: 1px solid black; 
}

Quindi aggiungere il css al codice in base ai requisiti.

<td class="topBorderOnly bottomBorderOnly">

Questo aggiungerà sia il margine superiore che quello inferiore, analogamente per il resto.

fonte

2013-09-04 09:48:10 AurA

questo rimuoverà tutto td nel caso in cui avessi bisogno di qualche bordo td per visualizzare ... –

@AurA la tua risposta è buona ma OP chiaramente ha detto che non vuole usare i CSS. –

sì questo rimuoverà tutto il bordo td e il bordo div mostrerà ... puoi vedere l'output ... Ho aggiornato la risposta jsfiddle – AurA

soluzione semplice dalla mia estremità è quella di mantenere un'altra tabella con bordo e inserire il tavolo nel tavolo esterno.

<table border="1"> 
<tr> 
    <td> 
     <table border="0"> 
      <tr> 
       <td>one</td> 
       <td>two</td> 
      </tr> 
      <tr> 
       <td>one</td> 
       <td>two</td> 
      </tr> 
     </table> 
    </td> 
</tr> 

</table>

fonte

2013-09-04 09:51:49 NamingException

Direi che è una soluzione breve e intelligente basata sulle restrizioni che ha mantenuto. – AurA

@AurA ThanQ .... :) – NamingException

@NamingException +1 per la tua risposta molto claustrale. –

Prova:

<table border="1"> 
    <tr> 
    <td> 
     <table border=""> 
     ... 
     </table> 
    </td> 
    </tr> 
</table>

fonte

2013-09-04 09:53:28 beautifulcoder

<table border="1" cellspacing="0" cellpadding="0"> 
    <tr> 
     <td> 
      <table border="0"> 
       <tr> 
        <td>one</td> 
        <td>two</td> 
       </tr> 
       <tr> 
        <td>one</td> 
       </tr> 
      </table> 
     </td> 
    </tr> 
</table>

fonte

2013-09-04 09:56:36 Smuuf

Per rimuovere i bordi tra le celle, pur mantenendo il bordo intorno al tavolo, aggiungere l'attributo rules=none al tag table.

In HTML non è possibile ottenere il rendering specificato nell'ultima figura della domanda. Esistono varie soluzioni complicate basate sull'utilizzo di altre strutture di markup.

fonte

2013-09-04 10:48:57

Questo è bello. +1 per il collegamento alle regole .. –

Prima

<table border="1"> 
     <tr> 
     <td style='border-right:none;border-left:none;border-bottom:none;border-top:none'>one</td> 
     <td style='border-right:none;border-left:none;border-bottom:none;border-top:none'>two</td> 
     </tr> 
     <tr> 
     <td style='border-right:none;border-left:none;border-bottom:none;border-top:none'>one</td> 
     <td style='border-right:none;border-left:none;border-bottom:none;border-top:none'>two</td> 
    </tr> 
    </table>

Secondo esempio

<table border="1" cellspacing="0" cellpadding="0"> 
    <tr> 
    <td style='border-left:none;border-top:none'>one</td> 
    <td style='border-right:none;border-left:none;border-bottom:none;border-top:none'>two</td> 
    </tr> 
    <tr> 
    <td style='border-left:none;border-bottom:none;border-top:none'>one</td> 
    <td style='border-right:none;border-left:none;border-bottom:none;border-top:none'>two</td> 
</tr> 
</table>

fonte

2016-08-31 09:26:35 Guest

Come rimuovere td border con html?

risposta

Problemi correlati