Descărcați 10 imagini de fundal GRATUITE pentru secțiunea fluidelor pentru Divi

Dacă doriți să împrospătați aspectul secțiunilor dvs., acesta ar putea fi postul ideal pentru dvs. Am creat 10 imagini de fundal cu secțiuni de fluid diferite pe care le puteți descărca gratuit și utiliza pe orice site web pe care îl construiți. În plus, vă vom arăta, de asemenea, cum să combinați aceste imagini de fundal cu secțiuni fluide cu opțiunile încorporate ale Divi. Veți putea atribui orice fundal de gradient imaginii dvs. de fundal fluide și o puteți combina cu un fundal de gradient de rând pentru a vă asigura că și conținutul dvs. rămâne lizibil.

Să ajungem la asta!

previzualizare

Să începem aruncând o privire asupra celor 10 imagini de fundal diferite ale secțiunii fluide pe care le veți putea descărca mai jos. Am combinat imaginile cu fundaluri degradate pentru a crea rezultate unice. Vom împărtăși fiecare dintre combinațiile de gradient din această postare, dar simțiți-vă liber să experimentați cu diferite culori pentru a obține rezultatul final dorit.

Descărcați gratuit imaginile de fundal ale secțiunii fluide

Pentru a vă pune mâinile pe imaginile de fundal gratuite ale secțiunii de fluid, va trebui mai întâi să le descărcați folosind butonul de mai jos. Pentru a avea acces la descărcare, va trebui să vă abonați la lista noastră de e-mail Divi Daily folosind formularul de mai jos. Ca nou abonat, veți primi și mai multe bunătăți Divi și un pachet Divi Layout gratuit în fiecare luni! Dacă sunteți deja pe listă, pur și simplu introduceți adresa de e-mail de mai jos și faceți clic pe descărcare. Nu veți fi „resubscris” și nu veți primi e-mailuri suplimentare.

Descărcați fișierele

Descarcă gratis

Înscrieți-vă la buletinul informativ Divi și vă vom trimite prin e-mail o copie a pachetului final de planificare a paginii de destinație Divi, plus o mulțime de alte resurse, sfaturi și trucuri uimitoare și gratuite Divi. Urmăriți-vă și veți fi un maestru Divi în cel mai scurt timp. Dacă sunteți deja abonat, pur și simplu introduceți adresa de e-mail de mai jos și faceți clic pe descărcare pentru a accesa pachetul de aspect.

DESCARCA

V-ați abonat cu succes. Vă rugăm să verificați adresa de e-mail pentru a vă confirma abonamentul și pentru a obține acces la pachetele de layout Divi săptămânale gratuite!

Recreați secțiunea

Adăugați o nouă secțiune regulată

Spațiere

După ce ați descărcat toate fișierele imagine, accesați site-ul dvs. WordPress și deschideți o pagină nouă sau existentă. Apoi, folosind Visual Builder al lui Divi, adăugați o nouă secțiune obișnuită. Deschideți setările și modificați valorile de spațiu.

• Căptușeală de sus: 0 px
• Căptușeală inferioară: 0 px

Adăugați un rând nou

Structura coloanei

Continuați adăugând un rând nou în secțiunea dvs. utilizând următoarea structură de coloane:

Dimensionare

Fără a adăuga încă module, deschideți setările rândurilor și efectuați modificări la setările de dimensionare.

• Faceți acest rând lățime completă: Da
• Utilizați lățimea personalizată a jgheabului: da
• Lățimea jgheabului: 1

Spațiere

Adăugați și câteva valori de umplere la setările de spațiu.

• Căptușeală superioară: 312 px
• Căptușeală inferioară: 312 px
• Căptușire stânga coloană: 50 px
• Căptușire dreaptă coloană: 50 px

Adăugați un modul de text

Adauga continut

Este timpul să începeți adăugarea modulelor! Primul modul de care avem nevoie este un modul de text. Continuați și adăugați un conținut în caseta de conținut, de preferință un titlu H2 și un paragraf.

Setări text H2

Accesați setările de text H2 de mai jos și aplicați următoarele modificări:

• Rubrica 2 Font: Montserrat
• Titlul 2 Greutate font: Ultra Bold
• Rubrica 2 Culoarea textului: #FFFFFF
• Titlul 2 Dimensiune text: 82 px (desktop), 60 px (tabletă), 40 px (telefon)
• Titlul 2 Înălțimea liniei: 1.4em

Setări text

Modificați și setările de text generale.

• Culoarea textului: #FFFFFF
• Dimensiune text: 16 px
• Înălțimea liniei textului: 1.9em
• Orientare text: centru

Dimensionare

Continuați prin scăderea lățimii acestui modul pe desktop.

• Lățime: 58% (desktop), 100% (tabletă și telefon)
• Alinierea modulului: centru

Adăugați un modul buton

Adăugați o copie

Al doilea și ultimul modul de care avem nevoie este un modul buton. După adăugarea modulului sub modulul text, adăugați o copie.

Aliniere buton

Schimbați Aliniere buton în continuare.

• Aliniere buton: centru

Setări buton

Apoi, accesați setările butonului și efectuați câteva modificări.

• Utilizați stiluri personalizate pentru buton: Da
• Dimensiune text buton: 18 px
• Culoarea textului butonului: # 000000
• Culoarea fundalului butonului: #FFFFFF
• Lățimea chenarului butonului: 0 px
• Raza chenarului butonului: 0 px
• Distanța dintre litere și butoane: -1 px
• Buton Font: Montserrat
• Greutatea fontului: Ultra Bold
• Stilul fontului: majuscule

Spațiere

Nu în ultimul rând, adăugați spațiu între modulul anterior și acesta adăugând o marjă de sus.

• Marja superioară: 25 px

Fundalul secțiunii de fluid # 1

Secțiunea Gradient Background

Utilizați următorul fundal de gradient pentru secțiunea dvs.:

• Culoare 1: # 000000
• Culoare 2: # 2d5b9b
• Tipul gradientului: liniar
• Direcția gradientului: 137deg
• Poziția inițială: 48%

Secțiunea Imagine de fundal

Încărcați fișierul „ fluid-style-1.png ” pe care îl puteți găsi în folderul de descărcare și combinați-l cu următoarele setări de fundal:

• Dimensiunea imaginii de fundal: dimensiunea reală
• Poziția imaginii de fundal: Centru

Fundal gradient de rând

Pentru a completa, adăugați un gradient de rând deasupra fundalului secțiunii. Acest lucru va face textul mai lizibil. De asemenea, vă va ajuta să adăugați o anumită adâncime paginii dvs.

• Culoare 1: rgba (0,0,0,0,67)
• Culoare 2: rgba (255,255,255,0)
• Tipul gradientului: radial
• Direcție radială: centru

Fundalul secțiunii de fluid # 2 și # 3

Secțiunea Gradient Background

A doua și a treia imagine de fundal a secțiunii fluide utilizează următorul fundal de gradient al secțiunii:

• Culoare 1: # 4f009e
• Culoare 2: # fa00ff
• Tipul gradientului: liniar
• Direcția gradientului: 137deg
• Poziția inițială: 48%

Secțiunea Imagine de fundal

Încărcați fișierul „ fluid-style-2.png ” sau „ fluid-style-3.png ” pe care îl puteți găsi în folderul de descărcare și combinați-l cu următoarele setări de fundal:

• Dimensiunea imaginii de fundal: dimensiunea reală
• Poziția imaginii de fundal: Centru

Fundal gradient de rând

Adăugați și un fundal subtil de gradient de rând:

• Culoare 1: rgba (255,48,75,0.13)
• Culoare 2: rgba (255,255,255,0)
• Tipul gradientului: radial
• Direcție radială: centru

Fundalul secțiunii de fluid # 4

Secțiunea Gradient Background

Utilizați următorul fundal de gradient pentru secțiunea dvs.:

• Culoare 1: # 00245e
• Culoare 2: # ffee00
• Tipul gradientului: liniar
• Direcția gradientului: 137deg
• Poziția inițială: 48%

Secțiunea Imagine de fundal

Încărcați fișierul „ fluid-style-4.png ” pe care îl puteți găsi în folderul de descărcare și combinați-l cu următoarele setări de fundal:

• Dimensiunea imaginii de fundal: dimensiunea reală
• Poziția imaginii de fundal: Centru

Fundal gradient de rând

Pentru a termina, adăugați un fundal de gradient de rând folosind următoarele setări:

• Culoare 1: rgba (0,0,0,0,37)
• Culoare 2: rgba (255,255,255,0)
• Tipul gradientului: radial
• Direcție radială: centru

Fundalul secțiunii de fluid # 5

Secțiunea Gradient Background

Adăugați următorul fundal de gradient în secțiunea dvs.:

• Culoare 1: # 04000f
• Culoare 2: # 00436d
• Tipul gradientului: liniar
• Direcția gradientului: 137deg
• Poziția inițială: 48%

Secțiunea Imagine de fundal

Apoi, încărcați fișierul „ fluid-style-5.png ” pe care îl puteți găsi în folderul de descărcare și combinați-l cu următoarele setări de fundal:

• Dimensiunea imaginii de fundal: dimensiunea reală
• Poziția imaginii de fundal: Centru

Fundal gradient de rând

Completați proiectarea utilizând următorul fundal de gradient de rând:

• Culoare 1: rgba (0,0,0,0,58)
• Culoare 2: rgba (255,255,255,0)
• Tipul gradientului: radial
• Direcție radială: centru

Fundalul secțiunii de fluid # 6

Secțiunea Gradient Background

Utilizați următoarea combinație uimitoare de fundal cu gradient de secțiune:

• Culoare 1: # 4800ff
• Culoare 2: # c854ff
• Tipul gradientului: liniar
• Direcția gradientului: 137deg
• Poziția inițială: 48%

Secțiunea Imagine de fundal

Încărcați fișierul „ fluid-style-6.png ” pe care îl puteți găsi în folderul de descărcare și combinați-l cu următoarele setări de fundal:

• Dimensiunea imaginii de fundal: dimensiunea reală
• Poziția imaginii de fundal: Centru

Fundal gradient de rând

Nu în ultimul rând, adăugați o suprapunere de fundal cu gradient de rând.

• Culoare 1: rgba (0,0,0,0,51)
• Culoare 2: rgba (255,255,255,0)
• Tipul gradientului: radial
• Direcție radială: centru

Fundalul secțiunii de fluid # 7

Secțiunea Gradient Background

Aplicați următoarele setări de fundal de gradient secțiunii dvs.:

• Culoare 1: # ff8300
• Culoare 2: # 52006b
• Tipul gradientului: liniar
• Direcția gradientului: 137deg
• Poziția inițială: 48%

Secțiunea Imagine de fundal

Încărcați fișierul „ fluid-style-7.png ” pe care îl puteți găsi în folderul de descărcare și combinați-l cu următoarele setări de fundal:

• Dimensiunea imaginii de fundal: dimensiunea reală
• Poziția imaginii de fundal: dreapta sus

Fundal gradient de rând

În cele din urmă, adăugați un fundal de gradient de rând în partea de sus a secțiunii.

• Culoare 1: rgba (106,0,198,0,34)
• Culoare 2: rgba (255,255,255,0)
• Tipul gradientului: radial
• Direcție radială: centru

Fundalul secțiunii de fluid # 8

Secțiunea Gradient Background

Aplicați următorul fundal de gradient albastru la secțiunea dvs.:

• Culoare 1: # 0b43dd
• Culoare 2: # 09f9ed
• Tipul gradientului: liniar
• Direcția gradientului: 137deg
• Poziția inițială: 48%

Secțiunea Imagine de fundal

Încărcați fișierul „ fluid-style-8.png ” pe care îl puteți găsi în folderul de descărcare și combinați-l cu următoarele setări de fundal:

• Dimensiunea imaginii de fundal: dimensiunea reală
• Poziția imaginii de fundal: stânga sus

Fundal gradient de rând

Completați-vă designul aplicând un fundal de gradient de rând.

• Culoare 1: rgba (0,7,119,0,57)
• Culoare 2: rgba (255,255,255,0)
• Tipul gradientului: liniar
• Direcție radială: centru

Fundalul secțiunii de fluid # 9

Secțiunea Gradient Background

Adăugați următorul fundal de gradient în secțiunea dvs.:

• Culoare 1: # 051f89
• Culoare 2: # 6d0272
• Tipul gradientului: liniar
• Direcția gradientului: 137deg
• Poziția inițială: 48%

Secțiunea Imagine de fundal

Încărcați fișierul „ fluid-style-9.png ” pe care îl puteți găsi în folderul de descărcare și combinați-l cu următoarele setări de fundal:

• Dimensiunea imaginii de fundal: copertă
• Poziția imaginii de fundal: Centru

Fundal gradient de rând

Nu în ultimul rând, creșteți lizibilitatea conținutului dvs. utilizând un fundal cu gradient de rând.

• Culoare 1: rgba (0,0,0,0.59)
• Culoare 2: rgba (255,255,255,0)
• Tipul gradientului: radial
• Direcție radială: centru

Fundalul secțiunii de fluid # 10

Secțiunea Gradient Background

Ultimul exemplu necesită următorul fundal de gradient al secțiunii:

• Culoare 1: # 051f89
• Culoare 2: # 6d0272
• Tipul gradientului: liniar
• Direcția gradientului: 137deg
• Poziția inițială: 48%

Secțiunea Imagine de fundal

Încărcați fișierul „ fluid-style-10a.png ” pe care îl puteți găsi în folderul de descărcare și combinați-l cu următoarele setări de fundal:

• Dimensiunea imaginii de fundal: dimensiunea reală
• Poziția imaginii de fundal: stânga sus

Fundal gradient de rând

Adăugați un fundal de gradient de rând în continuare.

• Culoare 1: rgba (0,0,0,0.59)
• Culoare 2: rgba (255,255,255,0)
• Tipul gradientului: radial
• Direcție radială: centru

Imagine de fundal rând

Adăugați și o imagine de fundal la rândul dvs. Găsiți „ fluid-style-10b.png ” în folderul de descărcare, încărcați-l și combinați-l cu următoarele setări de fundal:

• Dimensiunea imaginii de fundal: dimensiunea reală
• Poziția imaginii de fundal: jos dreapta

previzualizare

Acum că am parcurs toți pașii, să aruncăm o privire finală asupra rezultatului final.

Gânduri finale

În această postare, am împărtășit 10 imagini de fundal diferite și unice ale secțiunii fluide pe care le puteți folosi pe propriile site-uri web fără restricții. Mai mult decât atât, v-am oferit, de asemenea, fundaluri de gradient uimitoare pe care le puteți combina cu imaginile de fundal fluide folosind doar opțiunile încorporate ale Divi. Dacă aveți întrebări sau sugestii, asigurați-vă că lăsați un comentariu în secțiunea de comentarii de mai jos și spuneți-ne care dintre imaginile de fundal ale secțiunii fluide vă plac cel mai mult!