Differentierende tabeller fra deres baggrund hjælper med at understrege indholdet af tabellen i forhold til alt andet på websiden. For at tilføje en baggrundsfortegnelse skal du tilpasse det cascading style sheet (CSS), der understøtter din webside.
Kom i gang
Den bedste måde at tilføje et baggrundsbillede til en tabel på er at bruge CSS
baggrund
ejendom. For at forberede dig til at skrive CSS effektivt og for at undgå uventede displayfejl, skal du åbne dit baggrundsbillede og notere højden og bredden. Upload derefter dit billede til din hostingudbyder. Test webadressen for billedet; en af de mest almindelige årsager til, at billederne ikke vises, er fordi der er en skrivefelt i URL'en. Når du er færdig med dette trin, skal du sætte en CSS-stilblok i hovedet på dit dokument:
bord {baggrund: url (" URL til billede ") no-repeat;} Indstil bredden og højden af bordet for at matche billedbredden og højden. Hvis dine tabelindhold er større end billedhøjde og bredde, vises baggrundsbilledet kun én gang. Ovenstående instruktioner sætter det samme baggrundsbillede på hver tabel på siden. Hvis du vil sætte baggrunden på kun specifikke tabeller, skal du bruge en klasse
table.background {baggrund: url (" URL til billede ") no-repeat;} Større tabeller eller tabeller med mere indhold kan muligvis have baggrundsrepetionen, så hele tabellen er fyldt. Skift værdien i dit CSS, så billedet gentages på y-aksen, x-aksen eller er flisebelagt på begge. baggrund: url ("URL til billede") gentagelse;
Som standard vil gentagelsesværdien blive flisebelagt, men du kan også indstille gentagelsesværdien til repeat-x
eller gentag-y Eventuelle baggrundsfarver, der er indstillet på tabelcellerne, tilsidesætter baggrundsbilledet på bordet. Så vær forsigtig, når du bruger baggrundsfarver på dine celler i kombination med baggrundsbildebilleder. Tabel baggrunde sætter dine tabeller bortset fra den underliggende side. Men tænk to gange før du bruger denne teknik. Indsætning af et neutralt billede må ikke være distraherende, men komplicerede billeder, der er beregnet til at være søde (for eksempel at indsætte et billede af en killing bag et bord med angivelse af kæledyrsoptagelser) kan virke uprofessionelle og kan påvirke læsbarheden af tabeldataene. Ethvert billede du bruger skal være korrekt licenseret; bare fordi du kan finde et foto på internettet betyder det ikke, at du kan tilpasse det til eget brug. Respekter ophavsrettigheder!
celle 1 celle 2 celle 1 celle 2 …
Sæt en baggrund på bare en tabel
class = "baggrund" style = "width: 400px; height: 500px;> …
Lad tabellen Baggrundsbillede gentage
at flise vandret eller lodret.
Baggrundsfarver for celler Baggrundsfortegnelse for tabellen Baggrund
Overvejelser
