Ora pentru o altă provocare CodePen! Vrem să vă luați un paragraf clar și să aplicați un decalaj cap la litera inițială - cele mai bune exemple vor fi prezentate într-o săptămână sau cam asa ceva!
Recent am publicat un tutorial pe inițial litere
, o proprietate CSS aflată în prezent în discuție la W3C. Dacă sunteți nou să renunțați la capace, aruncați o privire:
Indiferent dacă utilizați această tehnică nouă sau o abordare CSS mai stabilă, vrem să ne arătați ce este posibil cu capacele de coborâre CSS. Fii creativ, fii decorativ, folosește sensibilitățile tipografice și imaginația designerului tău pentru a ne arunca șosetele. Puteți utiliza fonturi, culori, poziționare, fundaluri, transformări, gradienți, măști, orice este posibil.
De obicei, cu aceste provocări vă rugăm să nu atingeți markup-ul, dar în acest caz puteți schimba pasajul folosit pentru a vă da scrisoarea inițială pe care o preferați (de exemplu: un "O" ar putea fi potrivit pentru ceea ce proiectați sau "P" s-ar potrivi cu fontul pe care îl utilizați).
Notă: asigurați-vă că acordați credit acolo unde este necesar.
Iată ce trebuie să faceți, în câțiva pași simpli.
În primul rând, mergeți la demonstrația de pe CodePen.
Loveste Furculiţă pentru a crea o copie proprie a acestuia, adăugați un pasaj diferit de text dacă doriți, apoi efectuați cât mai multe modificări pe care le doriți pe CSS.
Dacă sunteți conectat (ă) la CodePen puteți edita descrierea apăsând pe Setări buton. Utilizați acest lucru pentru a da oamenilor o idee despre ceea ce ați făcut.
Lovit Salvați, ați terminat. Asigurați-vă că ne-ați informat în comentarii când ați terminat - și nu ezitați să ne anunțați prin tweeting-ul nostru @wdtuts, de asemenea.
Asta e! Toate intrările vor fi adăugate la această colecție pe CodePen și cele mai bune exemple vor fi prezentate aici și pe social media foarte curând!
Mult noroc și nu uitați să urmați Envato Tuts + pe Codepen!