Nuo CS6 versijos pasirodymo „Adobe“ įdiegė „Photoshop“ labai naudingą parinktį išdėstyti ir kurti interneto dizainą. Operacija yra labai lengva ir visų pirma greitai. Naudodamiesi programa galėsime sukurti pakopinius stiliaus lapus, atsižvelgdami į mūsų formas ir teksto sluoksnius. Procedūra yra tokia paprasta, kaip sukurti maketą, nukopijuoti kodo versijos elementus ir įklijuoti į mūsų lapą.
Tai labai geras variantas, ypač todėl, kad tai leidžia mums pamatyti savo dizaino raidą vizualiai ir realiu laiku. Čia yra keletas patarimų, kaip naudoti šią parinktį ir gauti maksimalus našumas:
Pasistenkite būti tikslūs
Norėdami gauti profesionalų rezultatą, rekomenduojama atsižvelgti į jūsų svetainės matmenis ir proporcijas. Nustatykite kuriamo šablono pločio ir aukščio vertes ir pritaikykite jas savo makete. Kai nukopijuosite CSS kodą, kiekvieną elementą įdėsime kaip atstumą pikseliais tarp kiekvieno elemento ir drobės kraštų. Taip pat atsižvelkite į dydžius ir hierarchines priežastis, kurias ketinate įtraukti į savo dizainą, įskaitant kiekvieno elemento išlygiavimą ir tarpus tarp jų, kad jūsų vartotojai galėtų kuo geriau įskaityti.
Vadovų ir sąsajos taisyklių naudojimas padės jums sukurti tvarkingą ir švarų šabloną, kurio visi elementai būtų visiškai sulygiuoti.
Konfigūruokite visas kiekvieno elemento charakteristikas
Galimybė nukopijuoti CSS kodą suteikia mums galimybę labai tiksliai suprojektuoti savo svetainę naudojant formos ir teksto sluoksnius. Kiekvieno sluoksnio turinys bus nukopijuotas į mainų sritį ir mes galime greitai jį įklijuoti į savo stiliaus lapą. Iš formos sluoksnių užfiksuokite šių parametrų reikšmes:
- Dydis
- Pozicija
- Insulto spalva
- Užpildymo spalva (įskaitant gradientus)
- Mesti šešėlį
Iš teksto sluoksnių galime užfiksuoti šias reikšmes:
- Šrifto šeima
- Šrifto dydis
- Šrifto storis
- Linijos aukštis
- Pabraukta
- Perbraukimas
- Viršutinis indeksas
- Abonementas
- Teksto lygiavimas
Turėkite tai omenyje ir nustatykite kiekvieną iš šių verčių, kad pateiktų jūsų ieškomą stilių.
Darbas su sluoksnių grupėmis
Ši funkcija verčia mūsų darbą, suskirstytą pagal dviejų tipų klases, po vieną kiekvienai grupei, sujungiančiai figūrų ar teksto sluoksnius, ir klasę kiekvienam iš šių tipų. Kiekviena grupės klasė atstovaus pagrindiniam div elementui, kuriame bus antrojo div elementai, kurie atitiks kiekvienoje grupėje įterptus sluoksnius. Tokiu būdu viršutinės ir kairiosios vaikų talpyklų vertės bus nustatomos atsižvelgiant į pirminį sudėtinį rodinį. Turite nepamiršti, kad ši parinktis negalima naudojant išmaniuosius objektus ir ji nebus taikoma daugiau nei vienam sluoksniui vienu metu, nebent jie būtų sugrupuoti.
Veiksmai konvertuoti
Sukūrę modelį, suasmeninote kiekvieną elementą ir sugrupavote juos pagal grupes, turėsite atlikti tik šiuos veiksmus:
- Eikite į sluoksnių skydą ir pasirinkite vieną iš šių dviejų parinkčių:
- Dešiniuoju pelės mygtuku spustelėkite formos ar teksto sluoksnį arba sluoksnių grupę ir pasirinkite Kopijuoti CSS kontekstiniame meniu.
- Pasirinkite formos ar teksto sluoksnį arba sluoksnių grupę, tada pasirinkite parinktį Kopijuoti CSS skydo meniu Sluoksniai.
-
Įklijuokite kodą į savo stiliaus lapo dokumentą ir pritaikykite jį savo puslapiams naudodami HTML5.
