Het onderscheiden van tabellen van hun achtergrond helpt om de inhoud van de tabel te benadrukken ten opzichte van al het andere op de webpagina. Als u een achtergrond in de tabel wilt toevoegen, moet u de cascading style sheet (CSS) die uw webpagina ondersteunt, aanpassen.
Ermee beginnen
De beste manier om een achtergrondafbeelding aan een tabel toe te voegen, is door de CSS te gebruiken
achtergrond
eigendom. Om uzelf voor te bereiden om de CSS effectief te schrijven en onverwachte schermglitches te voorkomen, opent u uw achtergrondafbeelding en noteert u de hoogte en breedte. Upload vervolgens uw afbeelding naar uw hostingprovider. Test de URL voor de afbeelding; een van de meest voorkomende redenen waarom afbeeldingen niet worden weergegeven, is omdat de URL een typefout bevat. Nadat u deze stap hebt voltooid, plaatst u een CSS-stijlblok in de kop van uw document:
tabel {background: url (" URL naar afbeelding ") geen herhaling;} Stel de breedte en hoogte van de tabel in op basis van de breedte en hoogte van de afbeelding. Als de inhoud van uw tabel groter is dan de hoogte en breedte van het beeld, wordt de achtergrondafbeelding slechts één keer weergegeven. Met de bovenstaande instructies wordt dezelfde achtergrondafbeelding ingesteld voor elke tabel op de pagina. Als u de achtergrond alleen op specifieke tabellen wilt zetten, moet u een klasse
table.background {background: url (" URL naar afbeelding ") geen herhaling;} Grotere tabellen, of tabellen met meer inhoud, moeten de achtergrond herhalen zodat de hele tabel gevuld is. Wijzig de waarde in uw CSS zodat de afbeelding herhaald wordt op de y-as, de x-as of op beide tegels. achtergrond: url ("URL naar afbeelding") herhalen;
Standaard wordt de herhalingswaarde betegeld, maar u kunt ook de herhalingswaarde instellen op herhaal-x
of herhaal-y Alle achtergrondkleuren die op de tabelcellen zijn ingesteld, overschrijven de achtergrondafbeelding in de tabel. Dus wees voorzichtig bij het gebruik van achtergrondkleuren op uw cellen in combinatie met achtergrondafbeeldingen op de tafel. Met tafelachtergronden worden uw tabellen gescheiden van de onderliggende pagina. Denk echter nog een keer na voordat je deze techniek gebruikt. Het invoegen van een neutrale afbeelding mag niet storend zijn, maar gecompliceerde afbeeldingen die bedoeld zijn als schattig (bijvoorbeeld het invoegen van een afbeelding van een kitten achter een tafel die aangeeft dat een huisdier wordt aangenomen) kunnen onprofessioneel lijken en de leesbaarheid van de tabelgegevens beïnvloeden. Elke afbeelding die u gebruikt, moet de juiste licentie hebben; gewoon omdat je een foto op het web kunt vinden, betekent nog niet dat je het voor je eigen gebruik kunt gebruiken. Respecteer auteursrechten!
cel 1 cel 2 cel 1 cel 2 …
Zet een achtergrond op slechts één tafel
class = "background" style = "width: 400px; height: 500px;> …
Laat de achtergrondafbeelding van de tabel herhalen
om horizontaal respectievelijk verticaal te betegelen.
Celachtergrondkleuren blokkeren de achtergrondafbeelding van de tabel
overwegingen
