Додадете боја или слика во позадина на веб-страницата на CSS

7 декември 2013 година

Можете да ја прилагодите позадината на вашата веб-страница на еден од следниве начини:

веб-страницата

  1. Нанесете униформен или градиентен ефект на боја на позадината на веб-страницата
  2. Додадете тапет на веб-страница
  3. Додадете униформа боја, градиент на бои, слика или граница на некоја област

CSS-кодот за боја е: тело

Првиот со дефинирање на бојата на позадината и вториот со вчитување на слика на позадината на страницата. Поставувањето слика на дното на страницата не треба да ве залажува. Ништо нема да се постигне со поставување огромна слика, без оглед колку е голема, не можете да бидете сигурни дека посетителот нема монитор со дијагонала поголема од тоа, така што големината на мониторот ќе ја надмине големината на сликата. Во основа, сликата во позадина е мала слика што прелистувачот ќе знае да ја повтори.

CSS код за додавање на слика во позадина: тело

  • background: Ги поставува сите својства на позадината во изјава
  • background-color: Ја поставува бојата на позадината за CSS-елемент
  • background-image Ја поставува позадинската слика за CSS-елемент
  • позадина-позиција Ја поставува почетната позиција на позадина
  • background-repeat Поставува како ќе се повторува позадината

1. Позадина од квадратни слики.

Токму тука се појавува првиот проблем. Како прелистувачот ќе ги повтори? Претпоставуваме постоење на квадратна слика со страна од 2 см. Цртежот во рамките на плоштадот мора да се изврши на таков начин што при спојување на два квадрати и вертикално и хоризонтално, сликите се комбинираат совршено, за да не се добие впечаток на соседните парчиња, туку да се состои целина.

2. Позадина од снимки
Вториот проблем се јавува со сликите во позадина дефинирани како правоаголници со кои би сакале вкупно покривање на ширината на страницата, тие се повторуваат само вертикално. Проблемите генерирани од овие ленти во позадина не само што се потешки да се избегнат, туку се уште почести. Колку широката лента треба да биде? Колку е голем прозорецот на прелистувачот на посетителот. Ако прозорецот на прелистувачот е поширок од опсегот на позадината, тој ќе се повтори не само вертикално, туку и хоризонтално, што ќе даде впечаток на недовршена работа, непотребно проширена на десната страна.

3. Корелација на преден план.
Друг проблем, и ова е многу честа појава е корелацијата помеѓу позадината и карактеристиките на текстот и графиките што треба да бидат прикажани над неа. Преоптоварената позадина ќе го отежне читањето на текстот, фонтот со одредена боја ќе го оневозможи читањето на текст со одредени бои.

4. Корелацијата помеѓу позадината и пораката на страницата
Поради фактот што одредени позадини претставуваат слика само по себе, тоа сугерира одреден материјал или идеја., често дури и досадни.

2WebDesign

Со повеќе од една деценија искуство во веб дизајн и водено од безгранична страст за интернет, ве покануваме да ја посетите нашата веб-страница и да бидете инспирирани од читање на најинтересните статии од оваа област.