Daugiau nei 100 milijonų vartotojų naudojasi savo išmaniaisiais telefonais naršydami internete pagal com.score Inc. Šiai pamokai jums reikės „Dreamweaver CS5“ir naujesnės versijos. Šiame straipsnyje išsamiai aprašoma, kaip sukurti svetainę „jquery“mobiliesiems.
Žingsniai
Žingsnis 1. Atidarykite „Dreamweaver“ir eikite į failą> Naujas
Tada pamatysite langą „Naujas dokumentas“. Kairėje pusėje norite pasirinkti parinktį „puslapis iš pavyzdžio“, tada kitame stulpelyje pasirinkite „Mobilieji starteriai“, tada „jQuery Mobile (CDN)“
Žingsnis 2. Sukurkite puslapius
Kai atidarysite „jQuery Mobile“(CDN) failą, pamatysite puslapį, panašų į šį:
Nors techniškai tai yra vieno puslapio dokumentas, kiekviena antraštė reiškia skirtingą „puslapį“. Pvz., „Pirmas puslapis“yra svetainės mobiliesiems pagrindinis puslapis, „Antras puslapis“gali būti puslapis apie mus, „Trečias puslapis“- jūsų paslaugų puslapis ir pan
Žingsnis 3. Pažvelkite į kodą
Šie veiksmai gali būti gana sudėtingi, jei nesate susipažinę su pagrindiniu HTML. Norėdami sukurti turinį, pabandykite „Dreamweaver“dirbti „padalytu vaizdu“. Kaip patekti į šį režimą, jei pažvelgsite į kairįjį „Dreamweaver“kampą, po failų meniu, pamatysite keturias parinktis „kodas, padalijimas, dizainas ir tiesioginis“:
Pasirinkite paryškintą parinktį „padalinti“ir pamatysite kodo vaizdą bei faktinę svetainę. Pažvelkite į kodą
Žingsnis 4. Redaguokite kiekvieno puslapio antraštes
Yra (div data-role = "page"), o tai reiškia, kad tai yra naujo puslapio pradžia. Atminkite, kad kiekvienas puslapis yra susietas su skaičiumi 'div data-role = "page"' yra antras puslapis, 'div data-role = "page"' yra trečias puslapis ir pan.
'div data-role = "header"' yra antraštės sritis, o antraštės informaciją dedate tarp dviejų žymų "h1" ir "/h1".
5 veiksmas. Redaguokite turinį ir meniu elementus
'div data-role = "Turinys" "yra turinio skyriaus pradžia. Čia galite įdėti tikrąjį kiekvieno puslapio turinį. Atminkite, kad pirmame puslapyje yra:
-
ir jei pažvelgsite į tikrąjį tinklalapį, pamatysite, kad pirmajame puslapyje yra nuorodų sąrašas. 'ul data-role = "listview"' reiškia, kad norite, kad turinio srityje būtų nuorodų sąrašas. Pridėdami bet kokius meniu elementus arba 'data-role = "listview"', būtinai susiekite teisingą tekstą su tinkamais puslapiais. Pavyzdžiui, jei antrasis puslapis yra „Apie mus“, trečias - „Mūsų paslauga“, o ketvirtas puslapis - „Susisiekite su mumis“, tuomet norite pateikti:
Sukurkite svetainę mobiliesiems naudodami „Dreamweaver“5 veiksmas 1 kulka -
Dabar norėdami redaguoti turinį, tiesiog įdėkite tekstą tarp žymų „div data-role =" content "" ir „/div". Pavyzdžiui:
Sukurkite svetainę mobiliesiems naudodami „Dreamweaver“5 veiksmas 2 kulka
Žingsnis 6. Redaguokite poraštę
Jei norite redaguoti poraštę, tiesiog įdėkite tekstą į „Puslapio poraštės“tekstą.
Žingsnis 7. Pažvelkite į savo svetainę „tiesioginiu režimu“
Prisiminkite, kur perjungėte „padalijimo režimą“? toje srityje yra mygtukas, kuriame parašyta „gyvai“. Spustelėkite tai ir pamatysite, kaip jūsų svetainė atrodys telefone!
