İndir & amp;Divi ile 5 arka plan 1/2 asimetrik kavisli sütun kullanın

Asimetrik kavisli arka planı parlak gradyan renkleriyle birleştirmek, 2017’de büyüyen ve 2018’de var olmaya devam eden ve gelişmeye devam eden bir tasarım eğilimidir. 2018’de eğilimi sorunsuz bir şekilde takip etmenize yardımcı olmak için 1/2’de kullanabileceğiniz beş farklı arka plan görüntüsü yaptık Arka plan sütunu sütun gradyanının arka planı ile kombinasyon halinde. Ayrıca, bu yazının aşağıda, Photoshop dosyası dahil bu arka plan resmini ücretsiz olarak indirebilecek ve bir sonraki projeniz için kullanabilirsiniz. Bu arka plan görüntüsünün açıkça 1/2 sütunun arka planında tasarlandığını ve bazı durumlarda amacını yerine getireceğini unutmayın. Diğer sütun yapılarına uygulamak istiyorsanız, Photoshop dosyasındaki her görüntünün görüntü boyutlarını değiştirmeniz gerekir.
Sonuçlar Eğiticiye girmeden önce, bu yazının bir sonraki bölümünde ücretsiz olarak indirebileceğiniz 1/2 sütunun tüm sonuçlarına ve arka plan görüntülerine bakalım. 1/2 arka plan sütunu 1

1/2 arka plan sütunu 2

1/2 arka plan sütunu 3

1/2 arka plan sütunu 4

1/2 arka plan sütunu 5

Ücretsiz bir resim ve Photoshop dosyası almak için bu öğretici dosyasını indirin, önce aşağıdaki düğmeyi kullanarak indirmeniz gerekir. İndirmelere erişmek için, aşağıdaki formu kullanarak Divi Daily E -posta listemize abone olmanız gerekir. Yeni bir müşteri olarak, her Pazartesi daha fazla Divi’nin iyi ve ücretsiz Divi düzen paketleri alacaksınız! Zaten listede iseniz, e -posta adresinizi aşağıya girin ve İndir’i tıklayın. “Abone Olmayacak” veya Ek E -posta Almayacaksınız. Dosyayı indirin
Divi bültenine katılmak için ücretsiz indirin ve en iyi divi düzen paketinin kopyasına bir e -posta göndereceğiz, ayrıca birçok kaynak, ipucu ve olağanüstü ve ücretsiz divi hileleri. Takip et ve kısa sürede bir divi ustası olacaksınız. Abone olduysanız, e -posta adresinizi aşağıya yazın ve Düzen Paketine erişmek için İndir’i tıklayın.

Abone olmayı başardınız. Aboneliğinizi onaylamak için lütfen e -posta adresinizi kontrol edin ve ÜCRETSİZ DIVI Düzen Paketine erişin!
Divi ile 5 arka plan 1/2 asimetrik kavisli sütunu indirin ve kullanın
YouTube kanalına abone Olduğumuz Arka Plan Renk Ayarları bölümünü yeniden yaptırdığımız 1/2 sütun arka plan görüntüsü eklemeden önce, mevcut veya yeni sayfaya standart bir parça eklemelisiniz. Bunu yaptıktan sonra, parçanın arka plan rengi olarak ‘#f3f2f2’ ekleyin.
Sütun yapısının yeni bir satırı ekleyin. Az önce yaptığınız parçaya aynı iki sütunlu satır ekleyerek devam edin.

Sütun 1 Gradyan Arka Plan Ardından, satır ayarlarınızı açın ve ilk sütuna aşağıdaki gradyan arka planını (veya kullanmak istediğiniz diğer gradyan arka planını) ekleyin: ilk renk: #e02b20

Renk İkinci: #8300E9
Sütun 1 Gradyan Türü: Doğrusal
Sütun 1 Degrade Yönü: 180deg
Sütun 1 Başlangıç ​​Konumu: 0
Sütun 1 Son Konum: 100
Ayrıca, sütun 1’in arka plan görüntüsüne devam edin, devam edin ve bu yazının başında indirdiğiniz klasörde kullanmak istediğiniz arka plan görüntüsünün 1/2 sütunundan birini bulun ve arka plan görüntüsünüzle birlikte ekleyin. Aşağıdaki ayarlar:
Sütun 1 Arka Plan Görüntü Boyutu: Kapak

Sütun 1 Arka Plan Görüntü Pozisyonu: Orta
Sütun 1 Arka Plan Görüntüsü Tekrar: Tekrarlayın
Sütun 1 Karışık Arka Plan Görüntüsü: Normal
Sütun 2 Arka Plan Gradyan Kaydırın ve gradyanın arka planını satırınızın ikinci sütununa da ekleyin (yine, bu da renk paletinize uygun başka bir gradyanın arka planı olabilir):
İlk renk: #2B87da

Renk İkinci: #EDF000
Sütun 2 gradyan tipi: doğrusal
Sütun 2 gradyan yönü: 180deg
Sütun 2 Başlangıç ​​Konumu: 0
Sütun 2 Son Konum: 100
Sütun Arka Plan Resim 2 İlk sütun için yaptığınız seçeneği kullanırken ikinci sütuna seçilen arka plan resimleri 1/2 sütun ekleyin.
Sütunun arka planının tablette de iyi görünmesini sağlamak için her sütun için tablete özel dolgu ekleyin, her sütunun üstüne ve altına (yalnızca tablette) bazı özel pedler ’50px’ uygulayın.

Blurb modülünü birinci sütuna ekleyin Bir sonraki simge seçin, bulanık modülünü ilk sütununuza ekleyin, ‘Kullanım simgesi kullan’ seçeneğini etkinleştirin ve isteğe bağlı simgeyi seçin. Arka plan rengi sonra, arka plan alt kategorisini açın ve ‘RGBA (255.255 ekleyin. 255.0.95) ”) açıklamanızın arka plan rengi olarak. Bu biraz şeffaf beyaz renk, gradyanınızın arka planının, içeriğinizin okunabilirliğini etkilemeden bulanık modülünüzden parlamasına izin verecektir.

Simgelerin Tasarım sekmesine taşıma ayarları ve aşağıdaki ayarları görüntü kategorisine ve simgesine uygulayın:

Renk simgesi: #E02B20

Resim Yerleştirme/Simge: Üst

Simge yazı tipi boyutu kullanın: evet
Simge yazı tipi boyutu: 46px
Metin Ayarları Ardından, bir sonraki metin alt kategorisini açın ve aşağıdaki ayarların uygulandığından emin olun:
Metin Rengi: Karanlık
Tet Oryantasyonu: Orta

Yapışkan Tasarım sekmesini aşağı kaydırın, boyut alt kategorisini açın ve aşağıdaki ayarları kullanın:
Genişlik:% 70
Modül hizalaması: merkez

Mesafe Ardından, boşluk alt kategorisini açın ve bulanık modülünüz için aşağıdaki özel marj ve dolguyu kullanın:
Üst kenar boşluğu: 100 piksel
Alt kenar boşluğu: 100 piksel

Üst dolgu: 50 piksel
Sağ dolgu: 50px
Dolgu Alt: 50 piksel
Sol dolgu: 50 piksel
Sınır alt kategorisini açarak ve bulanıklık modülünüzün her köşesine ’10px’ ekleyerek sınır ayarları devam eder:
Hala sınır alt kategorisindeyken, üst ve alt için aşağıdaki sınır kuvvetlerini kullanın:
Sınır Genişliği: 5 piksel

Sınır rengi: #ffffff

Sınır Gücü: Katı
Son Kutu Gölgesi, aşağıdaki kutu gölgesini bulanık modülünüze uygulayın:
Yatay konum gölge kutusu: 0px
Dikey Konum Gölge Kutusu: 2px

Bulanık Güç Gölgesi Kutusu: 18px
Çiçek yayma kutusu: 0px Gölge Renk: RGBA (0.0,0,0.0.3)
Kutu Gölgesi Pozisyonu: Dış Gölge
Klon Blurb Modülü ve İkinci Kolona Yerleştirin Bulanık modülünü bitirdikten sonra şimdi simgeyi değiştirin, zamandan tasarruf edebilir, klonlayabilir ve ikinci sütuna da yerleştirebilirsiniz. Yapmanız gereken ilk şey, paylaştığınız içerikle eşleşen başka bir simge seçmektir.
Simgenin rengini değiştirin Simgenizin rengini sütun gradyanınızın arka planıyla eşleşen bir renge değiştirin. Bu durumda, yeni simgenin rengi ‘#2B87da’dır.
Tamamlamak için ‘Luminosity’ karışık modül bulanık karışımı modunu kullanmayı deneyin, simgeler ve metin aracılığıyla parlayan bir arka plan rengi oluşturmak için ‘parlaklık’ bulanık modülünüzden bir karışım modu olarak da kullanabilirsiniz.
Mobil sonuçların hücresel versiyonlarının, tabletlerden ve masaüstlerinden daha sınırlı bir ekran boyutu vardır. Bu yüzden cep telefonunda görünen hatta küçük bir değişiklik yapmamız gerekiyor. Size doğru bir şekilde ne yapacağınızı göstermeden önce, farka bakalım.

Önceki

Sonrasında

Şimdi klon çizgisi, hücresel versiyonun masaüstü ve tablette olduğu kadar iyi görünmesini sağlamak için, yaptığınız çizgileri klonlayarak başlayın. Masaüstü ve tablet hattının görünürlüğünü değiştirin, ardından masaüstü ve tablet için satırı açın, devam eden sekmeyi açın ve cep telefonundaki hattı devre dışı bırakın.

Hücresel satırın görünürlüğünü değiştirin Aynı şekilde, tabletlerde ve masaüstlerinde hücresel için satırları devre dışı bırakmalısınız.
Satır boyutunu değiştirin ve sütun arka plan görüntüsünün cep telefonunda iyi görünmesini sağlamak, tasarım sekmesini açın, boyut alt kategorisini açın ve aşağıdaki ayarları kullanın:

Bu çizgiyi tamamen genişletin: evet

Özel Talang genişliğini kullanın: Yalebar Talang: 1

Sonuçlar Şimdi tüm adımlardan geçtikten sonra, web sitenizde bulanık modülle birlikte beş farklı 1/2 sütun arka plan görüntüsü kullanarak elde edebileceğiniz şaşırtıcı sonuçların sonuna bakalım.1/2 arka plan sütunu 1

1/2 arka plan sütunu 2
1/2 arka plan sütunu 3
1/2 arka plan sütunu 4
1/2 arka plan sütunu 5

Bu yazıdaki son zihin, bir sonraki projeniz için kullanabileceğiniz 1/2 sütunun 5 farklı arka plan görüntüsünü paylaştık.Bu arka plan görüntüsünü bu yazının başında ücretsiz olarak indirebilir ve herhangi bir kısıtlama olmadan kullanabilirsiniz.Asimetrik kavisli arka plan görüntüleri, bu gradyanın arka planı ile birlikte 2017’de büyüyen ve 2018’de gelişmeye devam eden tasarım eğilimleridir. Sorularınız veya önerileriniz varsa;Aşağıdaki yorumlar bölümünde bir yorum bıraktığınızdan emin olun!

admin

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir