100 მილიონზე მეტი მომხმარებელი იყენებს სმარტფონებს ინტერნეტის დასათვალიერებლად com.score Inc. ისწავლეთ როგორ შექმნათ მობილური ვებ გვერდი სპეციალურად მობილური აუდიტორიისთვის. ამ გაკვეთილისთვის დაგჭირდებათ dreamweaver CS5 და ზემოთ. ეს სტატია დეტალურად აღწერს როგორ შევქმნათ jquery მობილური ვებსაიტი.
ნაბიჯები
ნაბიჯი 1. გახსენით Dreamweaver და გადადით ფაილზე> ახალი
ამის შემდეგ თქვენ ნახავთ "ახალ დოკუმენტს" ფანჯარას. მარცხენა მხარეს, თქვენ უნდა აირჩიოთ ვარიანტი "გვერდი ნიმუშიდან", შემდეგ სვეტში აირჩიეთ "მობილური დამწყებნი", შემდეგ "jQuery Mobile (CDN)"
ნაბიჯი 2. შექმენით გვერდები
მას შემდეგ რაც გახსნით jQuery Mobile (CDN) ფაილს, დაინახავთ გვერდს, რომელიც მსგავსია:
მიუხედავად იმისა, რომ ეს ტექნიკურად არის ერთ გვერდიანი დოკუმენტი, თითოეული სათაური წარმოადგენს განსხვავებულ "გვერდს". მაგალითად, "გვერდი ერთი" არის მთავარი გვერდი მობილური ვებსაიტისთვის, "გვერდი მეორე" შეიძლება იყოს ჩვენს შესახებ გვერდი, "მესამე გვერდი" შეიძლება იყოს თქვენი სერვისების გვერდი და ასე შემდეგ
ნაბიჯი 3. შეხედეთ კოდს
ეს ნაბიჯები შეიძლება საკმაოდ რთული იყოს, თუ თქვენ არ იცნობთ ძირითად HTML- ს. შინაარსის შესაქმნელად, სცადეთ იმუშაოთ Dreamweaver– ის „გაყოფილი ხედებით“. თუ როგორ უნდა მიხვიდეთ ამ რეჟიმში, თუ გადახედავთ Dreamweaver– ის მარცხენა კუთხეს, ფაილის მენიუს ქვემოთ, ნახავთ ოთხ ვარიანტს „კოდი, გაყოფა, დიზაინი და ცხოვრება“ასე:
აირჩიეთ მონიშნული ვარიანტი "გაყოფა" და თქვენ იხილავთ კოდის და ფაქტობრივი საიტის ხედს გვერდიგვერდ. გადახედე კოდს
ნაბიჯი 4. თითოეული გვერდის სათაურების რედაქტირება
არსებობს (div data-role = "გვერდი"), რაც ნიშნავს რომ ეს არის ახალი გვერდის დასაწყისი. გაითვალისწინეთ, რომ თითოეული გვერდი ასოცირდება რიცხვთან "div data-role =" გვერდი "არის მეორე გვერდი," div data-role = "გვერდი" არის მესამე გვერდი და ასე შემდეგ
'div data-role = "header" არის სათაურის არე, და თქვენ ათავსებთ თქვენს სათაურის ინფორმაციას ორ "h1" და "/h1" ტეგებს შორის.
ნაბიჯი 5. შინაარსისა და მენიუს ელემენტების რედაქტირება
'div data-role = "შინაარსი"' არის შინაარსის განყოფილების დასაწყისი. ეს არის სადაც თქვენ ათავსებთ თითოეული გვერდის რეალურ შინაარსს. გაითვალისწინეთ, რომ პირველ გვერდზე არის:
-
და თუ გადახედავთ რეალურ ვებ გვერდს, ხედავთ რომ პირველ გვერდს აქვს ბმულების სია. 'ul data-role = "listview" ნიშნავს იმას, რომ გსურთ ბმულების ჩამონათვალი შინაარსის არეალში. ნებისმიერი მენიუს ერთეულის ან "data-role =" listview "დამატებისას, დარწმუნდით, რომ დააკავშიროთ სწორი ტექსტი სწორ გვერდებთან რა მაგალითად, თუ გვერდი ორი არის "ჩვენს შესახებ", მესამე გვერდი არის "ჩვენი სერვისი" და მეოთხე გვერდი არის "დაგვიკავშირდით", მაშინ გსურთ განათავსოთ:
შექმენით მობილური ვებ გვერდი Dreamweaver– ით ნაბიჯი 5 ტყვია 1 -
ახლა შინაარსის შესაცვლელად, უბრალოდ განათავსეთ თქვენი ტექსტი "div data-role =" content "და"/div "ტეგებს შორის. Მაგალითად:
შექმენით მობილური ვებ გვერდი Dreamweaver– ით ნაბიჯი 5 ტყვია 2
ნაბიჯი 6. ქვედა კოლონტიტულის რედაქტირება
ქვედა კოლონტიტულის შესწორების მიზნით, უბრალოდ განათავსეთ თქვენი ტექსტი "გვერდის ქვედა კოლონტიტულის" ტექსტის ნაცვლად.
ნაბიჯი 7. შეხედეთ თქვენს ვებგვერდს "პირდაპირ რეჟიმში"
გახსოვთ სად გადახვედით "გაყოფილი რეჟიმში"? ზუსტად იმ მხარეში, არის ღილაკი, რომელიც ამბობს "ცოცხალი". დააწკაპუნეთ მასზე და ნახავთ, როგორ გამოიყურება თქვენი ვებ გვერდი ტელეფონზე!
