Как да направим градиентен фон в WordPress

Cascading Style Sheet Уеб дизайн кодът включва опция за градиент, така че можете да добавяте CSS само градиентни фонове към вашите WordPress сайтове, без да имате нужда от нарязани изображения. В WordPress не можете да приложите градиента към теглото на тялото, както бихте направили за солидни фонове, но можете да използвате контейнер div, който се обвива около целия уебсайт. Много теми, изградени върху CSS рамки вече включват такъв div, въпреки че можете да добавите един, ако вашата тема не е.

Стъпка 1
Отидете в ** wp-admin ** директорията на сайт и влезте в таблото за управление на WordPress. Придвижете се до ** Appearance ** и щракнете върху връзката ** Editor **. Кликнете върху връзката ** header.php ** под заглавието „Шаблони“, за да заредите HTML файла, съдържащ маркера за тялото на уебсайта ви.

Стъпка 2: Потърсете div с идентификатор на „контейнер“ теглото на тялото във вашия файл header.php. Ако не намерите, добавете един. Ето как би трябвало да изглежда: Запишете файла, като щракнете върху синия бутон ** Update File **. Ако сте добавили div, заредете ** footer.php ** в редактора и добавете **** директно над ****, за да затворите div.

Step 3
Load ** style. css ** в редактора. Добавете този код в самото дъно на файла: #container {background-color: # 038394; background-image: линеен градиент (отгоре, # 038394, # 00CCCC); background-image: -webkit-линеен градиент (отгоре, # 038394, # 00CCCC); background-image: -moz-линеен градиент (отгоре, # 038394, # 00CCCC); } Горният код поставя резервно копие за браузъри, които не поддържат градиенти. Настройването на "background-image" на "linear-gradient" създава градиентния фон. Най-малкото, трябва да зададете посока, в която градиентът да започва, а след това два цвята, които избледняват. Добавете отново този ред код два пъти, добавяйки префиксите на Webkit и Mozilla за браузъри Chrome, Safari и Firefox.
Щракнете върху синия бутон ** Update File **, за да запишете вашия style.css файл. Вашият градиент фон сега се появява на всяка страница на вашия уеб сайт на WordPress.

Съвет
Задайте всички полета на нула за "контейнер" div, ако видите бяло пространство около градиента.


URL:https://bg.whycomputer.com/Internet/100207234.html