એક મિનિટ કરતા ઓછા સમયમાં તમારી ફોટોશોપ ડિઝાઇનને સીએસએસ કોડમાં કેવી રીતે રૂપાંતરિત કરવી

સીએસ 6 સંસ્કરણના આગમન પછી, એડોબ ફોટોશોપમાં વેબ ડિઝાઇન્સના લેઆઉટ અને વિકાસ માટે એક ખૂબ જ ઉપયોગી વિકલ્પ અમલમાં મૂક્યો. ઓપરેશન છે બહુજ સરળ અને બધા ઉપર રáપિડો. એપ્લિકેશન દ્વારા અમે અમારા આકારો અને ટેક્સ્ટ સ્તરોને સંદર્ભ તરીકે લેતી કાસ્કેડિંગ શૈલી શીટ્સ જનરેટ કરવામાં સમર્થ થઈશું. પ્રક્રિયા આપણા મોકઅપને વિકસાવવા જેટલી સરળ છે, અમારા તત્વોના કોડ સંસ્કરણની ક copપિ બનાવવી અને તેને અમારી શીટ પર ચોંટાડવા.

તે ખૂબ જ સારો વિકલ્પ છે ખાસ કરીને કારણ કે તે અમને વિઝ્યુઅલ દ્રષ્ટિએ અને વાસ્તવિક સમયમાં અમારી ડિઝાઇનનું ઉત્ક્રાંતિ જોવાની મંજૂરી આપે છે. આ વિકલ્પનો ઉપયોગ કરવા અને મેળવવા માટે અહીં કેટલીક ટીપ્સ આપી છે મહત્તમ પ્રભાવ:

ચોક્કસ હોવાનો પ્રયત્ન કરો

વ્યવસાયિક પરિણામ મેળવવા માટે, ભલામણ કરવામાં આવે છે કે તમે તમારી સાઇટના માપ અને પ્રમાણને ધ્યાનમાં લો. તમે ડિઝાઇન કરી રહ્યાં છો તે નમૂનાની પહોળાઈ અને ighંચાઈ મૂલ્યો સેટ કરો અને તેને તમારા મોકઅપ પર લાગુ કરો. જ્યારે તમે સીએસએસ કોડની નકલ કરો છો ત્યારે અમે દરેક તત્વને દરેક તત્વ અને કેનવાસની કિનારીઓ વચ્ચેના પિક્સેલ્સમાં અંતર સંદર્ભ તરીકે લઈશું. તમારા વપરાશકર્તાઓને મહત્તમ વાંચવા યોગ્યતા પ્રદાન કરવા માટે દરેક તત્વોના ગોઠવણી અને તે દરેક વચ્ચેના અંતર સહિત તમે તમારી ડિઝાઇનમાં શામેલ થવાનાં કદ અને વંશવેલો કારણોને પણ ધ્યાનમાં લો.

માર્ગદર્શિકાઓ અને ઇન્ટરફેસના નિયમોનો ઉપયોગ તમને તેના બધા તત્વો સાથે સંપૂર્ણપણે ગોઠવાયેલા, સુઘડ, સ્વચ્છ નમૂના બનાવવા માટે મદદ કરશે.

દરેક તત્વની બધી લાક્ષણિકતાઓને ગોઠવો

સીએસએસ કોડની ક copyપિ કરવાનો વિકલ્પ અમને આકાર અને ટેક્સ્ટ સ્તરોની મદદથી અમારી સાઇટને ખૂબ જ ચોકસાઇથી ડિઝાઇન કરવાની સંભાવના આપે છે. દરેક સ્તરની સામગ્રીની નકલ ક્લિપબોર્ડ પર કરવામાં આવશે અને અમે તેને ઝડપથી અમારી શૈલી શીટમાં પેસ્ટ કરી શકીએ છીએ. આકાર સ્તરોમાંથી, નીચેની સેટિંગ્સ માટેના મૂલ્યો મેળવો:

• કદ
• પોઝિશન
• સ્ટ્રોક રંગ
• રંગ ભરો (gradાળ સહિત)
• પડછાયો છોડો

ટેક્સ્ટ સ્તરોમાંથી આપણે નીચેના મૂલ્યો મેળવી શકીએ છીએ:

• ફontન્ટ કુટુંબ
• ફontન્ટ કદ
• ફontન્ટ જાડાઈ
• રેખા ઊંચાઇ
• રેખાંકિત
• સ્ટ્રાઈકથ્રુ
• સુપરસ્ક્રિપ્ટ
• સબસ્ક્રિપ્ટ
• ટેક્સ્ટ સંરેખણ

તે ધ્યાનમાં રાખો અને તમે શોધી રહ્યાં છો તે શૈલી પ્રદાન કરવા માટે આ દરેક મૂલ્યોને સેટ કરો.

લેયર જૂથો સાથે કામ કરો

આ ફંક્શન બે પ્રકારના વર્ગ દ્વારા આયોજિત અમારા કાર્યનું ભાષાંતર કરે છે, દરેક જૂથ માટે જે આકારો અથવા ટેક્સ્ટના સ્તરને એક સાથે લાવે છે અને આ પ્રકારના દરેક સ્તર માટે એક વર્ગ છે. દરેક જૂથ વર્ગ પિતૃ વિભાજન તત્વોનું પ્રતિનિધિત્વ કરશે જેમાં ચાઇલ્ડ ડિવ તત્વો શામેલ હશે જે દરેક જૂથમાં શામેલ કરેલા સ્તરોને અનુરૂપ હશે. આ રીતે, બાળકનાં કન્ટેનરની ટોચ અને ડાબી કિંમતો પેરેંટલ કન્ટેનરનો સંદર્ભ આપીને સેટ કરવામાં આવશે. તમારે ધ્યાનમાં રાખવું જ જોઇએ કે આ વિકલ્પ સ્માર્ટ objectsબ્જેક્ટ્સ સાથે ઉપલબ્ધ નથી અને જ્યાં સુધી તે જૂથબદ્ધ ન થાય ત્યાં સુધી તે એક સાથે એક કરતા વધુ સ્તર પર લાગુ થશે નહીં.

કન્વર્ટ કરવાનાં પગલાં

એકવાર તમે તમારો મockકઅપ કરો તે પછી, તમે દરેક તત્વને વ્યક્તિગત કર્યું છે અને તમે તેને જૂથો દ્વારા જૂથબદ્ધ કરી લો છો, તમારે ફક્ત આ પગલાંને અનુસરો:

• સ્તરો પેનલ પર જાઓ અને આ બે વિકલ્પોમાંથી એક પસંદ કરો:
  • આકાર અથવા ટેક્સ્ટ લેયર અથવા સ્તરનાં જૂથ પર જમણું-ક્લિક કરો અને પસંદ કરો સીએસએસ ક Copyપિ કરો સંદર્ભ મેનૂમાં.
  • આકારો અથવા ટેક્સ્ટ લેયર અથવા સ્તરોના જૂથને પસંદ કરો, પછી વિકલ્પ પસંદ કરો સીએસએસ ક Copyપિ કરો સ્તરો પેનલ મેનૂમાં.