Beliebte Beiträge Auf Dem Pc Und Software

Top Artikel Auf Internet - 2018

Ein Bild als Hintergrund für eine Tabelle auf einer Webseite festlegen

Die Unterscheidung von Tabellen von ihren Hintergründen hilft, den Inhalt der Tabelle im Vergleich zu allem anderen auf der Webseite hervorzuheben. Um einen Tabellenhintergrund hinzuzufügen, müssen Sie das Cascading Stylesheet (CSS) optimieren, das Ihre Webseite unterstützt.

Erste Schritte

Die beste Methode, um einer Tabelle ein Hintergrundbild hinzuzufügen, ist die Verwendung von CSS Hintergrund Eigenschaft. Um sich darauf vorzubereiten, das CSS effektiv zu schreiben und unerwartete Anzeigefehler zu vermeiden, öffnen Sie Ihr Hintergrundbild und notieren Sie sich die Höhe und Breite.

Laden Sie Ihr Bild dann zu Ihrem Hosting-Anbieter hoch. Testen Sie die URL für das Bild. einer der häufigsten Gründe, warum Bilder nicht angezeigt werden, ist ein Tippfehler in der URL.

Nachdem Sie diesen Schritt abgeschlossen haben, legen Sie einen CSS-Stilblock in den Kopf Ihres Dokuments:


  1. Schreiben Sie CSS für den Hintergrund Ihrer Tabelle und in den Stilblock einfügen: Tabelle {Hintergrund: URL (" URL zu Bild ") no-repeat; }
  2. Platzieren Sie Ihre Tabelle im HTML:








    Zelle 1 Zelle 2
    Zelle 1 Zelle 2
  3. Legen Sie die Breite und Höhe der Tabelle entsprechend der Bildbreite und -höhe fest. Breite: 400px; Höhe: 500px; "> ...

Wenn Ihr Tabelleninhalt größer als die Bildhöhe und -breite ist, wird das Hintergrundbild nur einmal angezeigt

Hintergrund auf Nur einen Tisch setzen

Die obigen Anweisungen setzen das gleiche Hintergrundbild auf jeder Tabelle auf der Seite.

Wenn Sie den Hintergrund nur auf bestimmte Tabellen setzen wollen, müssen Sie ein Klassen Attribut verwenden.

  1. Ändern Sie Ihr CSS so, dass es lautet: Tabelle. background {background: url (" URL zum Bild ") no-repeat; }
  2. Fügen Sie den Hintergrund der Klasse zu jeder Tabelle hinzu, die dieses Hintergrundbild haben soll. Legen Sie die Breite und Höhe für diese Tabellen fest. class = "background" style = "Breite: 400px; Höhe: 500px;> ...

    Lassen Sie die Tabelle Hintergrundbild

    wiederholen Bei größeren Tabellen oder Tabellen mit mehr Inhalt muss die Hintergrundwiederholung möglicherweise so ausgeführt werden, dass die gesamte Tabelle gefüllt wird Ändern Sie den Wert in Ihrem CSS, sodass das Bild auf der Y-Achse, der X-Achse oder auf der Kachel wiederholt wird beide.

    background: url (" URL zu image ") wiederholen ;

    Standardmäßig wird der Wiederholungswert gekachelt, Sie können aber auch den Wiederholungswert auf einstellen repeat-x oder repeat-y um horizontal bzw. vertikal zu kacheln

    Hintergrundfarbe der Zellen Blockiert das Hintergrundbild der Tabelle

    Alle Hintergrundfarben, die in den Tabellenzellen gesetzt sind überschreiben Sie das Hintergrundbild auf der Tabelle Seien Sie also vorsichtig, wenn Sie Hintergrundfarben für Ihre Zellen in Kombination mit Tabellenhintergrundbildern verwenden.

    Überlegungen

    Tabellenhintergründe heben Ihre Tabellen von der darunter liegenden Seite ab e vor der Verwendung dieser Technik. Das Einfügen eines neutralen Bildes kann nicht störend sein, aber komplizierte Bilder, die süß sein sollen (z. B. das Einfügen eines Bildes eines Kätzchens hinter einem Tisch, das Tieradoptionen anzeigt), können unprofessionell erscheinen und die Lesbarkeit der Tabellendaten beeinträchtigen.

    Beliebig Das Bild, das Sie verwenden, muss ordnungsgemäß lizenziert sein. Nur weil du ein Foto im Web findest, heißt das nicht, dass du es für dich selbst verwenden kannst.

    Respektiere das Urheberrecht!

    Senden Sie Ihren Kommentar