Како поставити слику као позадину за табелу

Користите својство позадине ЦСС да бисте додали позадину слике у табеле

Диференцирање табела из њихове позадине помаже у истицању садржаја табеле у односу на све остало на веб страници. Да бисте додали позадину табле, потребно је да подесите каскадни стилски стил (ЦСС) који подржава вашу веб страницу.

Почетак

Најбољи начин да додате позадинску слику у таблицу је да користите ЦСС својство позадине. Да бисте се припремили за ефикасно писање ЦСС-а и како бисте избјегли неочекиване проблеме при приказу, отворите своју слику у позадини и забележите висину и ширину.

Затим отпремите своју слику свом провајдеру хостинга. Испробајте УРЛ за слику; један од најчешћих разлога због којих се не приказују слике је зато што у УРЛ-у постоји грешка.

Након завршетка тог корака, ставите блок ЦСС стил у главу вашег документа:

<стиле типе = "тект / цсс">
  1. Напишите свој ЦСС за позадину на столу и ставите га унутар стила:
    табела {бацкгроунд: урл (" УРЛ то имаге ") не-понављање; }
  2. Поставите своју таблицу у ХТМЛ:
    <табела>
    <тр>
    <тд> ћелија 1
    <тд> ћелија 2

    <тр>
    <тд> ћелија 1
    <тд> ћелија 2

  3. Подесите ширину и висину табеле у складу са ширином и висином слике.
    <табле стиле = " видтх: 400пк; хеигхт: 500пк; "> ...

Ако је садржај табеле већи од висине и ширине слике, слика у позадини ће се приказивати само једном.

Ставите позадину на само један сто

Горе наведена упутства ће поставити исту позадину на свакој табели на страници.

Ако желите да поставите позадину на само одређене табеле, морате користити атрибут класе.

  1. Промените ЦСС како бисте читали:
    табле.бацкгроунд {бацкгроунд: урл (" УРЛ то имаге ") но-репеат; }
  2. Додајте позадину класе било којој табели коју желите имати у позадини. Подесите ширину и висину за те табеле.
    <табле цласс = "бацкгроунд" стиле = "видтх: 400пк; хеигхт: 500пк;> ...

Пустите понављање слике позадине табеле

Веће табеле или табеле са више садржаја можда ће морати поновити позадину тако да се цијела табела попуни. Промените вредност у ЦСС тако да се слика понавља на и-оси, к-оси или је обележена на оба.

позадина: урл (" УРЛ за слику ") понављање ;

Подразумевано ће поновљена вредност бити поплочана, али такође можете подесити поновну вриједност понављају-к или поновити-и на плочице хоризонтално или вертикално, респективно.

Боје позадине ћелије блокирају слику позадине табеле

Било које боје позадине које су постављене на ћелијама табеле ће превазићи позадинску слику на столу. Зато будите пажљиви када користите позадинске боје на вашим ћелијама у комбинацији са сликама позадине позадине.

Разматрања

Позадине у табели ће поставити своје табеле изван основне странице. Међутим, размислите два пута прије кориштења ове технике. Убацивање неутралне слике можда неће ометати, али компликоване слике које су намерне бити слатке (на пример, убацивање слике маца иза табеле која указује на усвајање кућних љубимаца) може изгледати непрофесионално и може утицати на читљивост табуларних података .

Свака слика коју користите мора бити правилно лиценцирана; само зато што можете пронаћи фотографију на Вебу не значи да можете да је прилагодите за своју употребу.

Поштујте цопиригхтове!