Wie td Grenze mit HTML entfernen?

htmlWie td Grenze mit HTML entfernen?

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

Dies wird Ausgangs Grenzen wie diese

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

Aber ich möchte die Grenze in der Tabelle wie diese

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

td nur nicht angezeigt Wie kann ich tun nur mit HTML-Markup. (NO CSS/NO INLINE STYLES)

In einigen Fällen brauche ich nur einige td Grenzen zu entfernen und einige td Grenze etwas zu öffnen:

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

Quelle

2013-09-04 Bhojendra Nepal

Sie haben CSS zu verwenden. wenn Sie kein separates Stylesheet verwenden möchten. Sie können das Attribut style in Ihrem HTML-Markup verwenden. –

Ich verstehe nicht, warum Sie CSS nicht verwenden möchten. Alles, was Sie erreichen möchten, ist sehr einfach bei der Verwendung von CSS: http://jsfiddle.net/K8hje/ – Jojo

es umgeben mit einem div und geben Sie es eine Grenze, und entfernen Sie die Grenze aus der Tabelle kann

<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>

Sie die

überprüfen

Gemäß Ihrer aktualisierten Frage .... wo Sie Grenzen hinzufügen oder entfernen möchten. Sie sollten entfernen Grenzen von der HTML-Tabelle und dann gehen Sie wie folgt

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

wie Sie nur die obere Grenze wollen Unter der Annahme. Ähnlich muss man für andere tun. Bessere Weise erstellen vier css-Klasse ...

Dann fügen Sie die CSS zu Ihrem Code je nach den Anforderungen.

<td class="topBorderOnly bottomBorderOnly">

Dies wird oberen und unteren Rand hinzufügen, ebenso für den Rest tun.

Quelle

2013-09-04 09:48:10 AurA

Dies wird alle td entfernen, falls ich etwas td Grenze zum anzeigen brauche ... –

@AurA Ihre Antwort ist gut, aber OP klar sagte er wolle nicht css benutzen. –

ja das wird alle td Grenze entfernen und die div Grenze wird zeigen ... Sie können die Ausgabe sehen ... Ich habe die Antwort jsfiddle – AurA

einfache Lösung von meinem Ende ist es, einen anderen Tisch mit Rand zu halten und fügen Sie Ihren Tisch in den äußeren Tisch.

<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>

Quelle

2013-09-04 09:51:49 NamingException

Dies würde ich sagen, ist eine kurze und intelligente Lösung basierend auf den Einschränkungen, die er eingehalten hat. – AurA

@AurA ThanQ .... :) – NamingException

@NamingException +1 für Ihre sehr claver Antwort. –

Versuchen:

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

Quelle

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>

Quelle

2013-09-04 09:56:36 Smuuf

um Grenzen zwischen den Zellen zu entfernen, während die Grenze um den Tisch zu halten, fügen Sie das Attribut rules=none zum table-Tag.

In HTML gibt es keine Möglichkeit, das in der letzten Abbildung der Frage angegebene Rendering zu erzielen. Es gibt verschiedene heikle Problemumgehungen, die auf der Verwendung einer anderen Markupstruktur basieren.

Quelle

2013-09-04 10:48:57

Dieser ist nett. +1 für Regeln verlinken .. –

Erste

<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>

Zweites Beispiel

<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>

Quelle

2016-08-31 09:26:35 Guest

Wie td Grenze mit HTML entfernen?

Antwort

Verwandte Themen