Բովանդակություն:

Ինչպես ստեղծել պարզ վեբ էջ ՝ օգտագործելով փակագծերը սկսնակների համար. 14 քայլ
Ինչպես ստեղծել պարզ վեբ էջ ՝ օգտագործելով փակագծերը սկսնակների համար. 14 քայլ
Anonim
Ինչպես ստեղծել պարզ վեբ էջ ՝ օգտագործելով փակագծերը սկսնակների համար
Ինչպես ստեղծել պարզ վեբ էջ ՝ օգտագործելով փակագծերը սկսնակների համար

Ներածություն

Հետևյալ հրահանգները տալիս են քայլ առ քայլ ուղեցույց ՝ փակագծերի միջոցով վեբ էջ պատրաստելու համար: Brackets- ը աղբյուրի կոդի խմբագիր է, որն առաջնային ուշադրություն է դարձնում վեբ զարգացման վրա: Ստեղծված է Adobe Systems- ի կողմից, այն անվճար և բաց կոդով ծրագրակազմ է, որը լիցենզավորված է MIT լիցենզիայով և ներկայումս պահվում է GitHub- ում Adobe- ի և այլ բաց կոդով ծրագրավորողների կողմից: Այն գրված է JavaScript, HTML և CSS լեզուներով:

Հրահանգներ

Նշում. - Բոլոր HTML պիտակները պետք է լինեն փակագծերի միջև.

Քայլ 1: Ներբեռնեք ծրագրակազմը

Ներբեռնեք ծրագրակազմը
Ներբեռնեք ծրագրակազմը

ներբեռնեք փակագծեր այս կայքից

Քայլ 2: Բացեք փակագծերը

Բաց փակագծեր
Բաց փակագծեր

բացել ներբեռնված փակագծերի ծրագիրը համակարգչում:

Քայլ 3: Ստեղծեք նոր ֆայլ

Ստեղծեք նոր ֆայլ
Ստեղծեք նոր ֆայլ

Փակագծեր բացելուց հետո կտտացրեք պատուհանի վերևի ձախ մասում գտնվող ֆայլի պատկերակին, այնուհետև կտտացրեք նոր, կտեսնեք նոր ֆայլ «Անվերնագիր»:

Քայլ 4: Պահել որպես ֆայլ

Պահել որպես.. ֆայլը
Պահել որպես.. ֆայլը

Աջ սեղմեք այս ֆայլի վրա «անվերնագիր», կտտացրեք պահպանել որպես, այնուհետև այն պետք է պահեք սկավառակի վրա

այս պահին դուք կարող եք ցանկացած անուն տալ ֆայլին, պարզապես համոզվեք, որ անունից հետո ավելացնել.. html (dot html):

Քայլ 5: Սկսեք DOCTYPE պիտակով

Սկսեք DOCTYPE պիտակով
Սկսեք DOCTYPE պիտակով

Յուրաքանչյուր html էջ պետք է սկսվի հետևյալ կառուցվածքի պիտակով: Այն դիտարկիչին ասում է, թե ինչ «կանոններ պետք է հետևել» HTML էջը մատուցելիս:

Քայլ 6: HTML պիտակ

HTML պիտակ
HTML պիտակ

և - այդ պիտակները պետք է սկսեն և ավարտեն փաստաթուղթը:

Քայլ 7: Գլխի և մարմնի պիտակներ

Գլխի և մարմնի պիտակներ
Գլխի և մարմնի պիտակներ

HTML պիտակների միջև գրեք և, որտեղ այն պարունակում է «կուլիսների» նյութեր: Բացի այդ, գրեք և որտեղ այն պարունակում է տեքստ, պատկերներ, տեսանյութեր, աուդիո և այլն:

Քայլ 8: Meta Tag

Meta Tag
Meta Tag

Պիտակների միջև գրեք այնտեղ, որտեղ այն տրամադրում է այնպիսի տեղեկություններ, ինչպիսիք են որոնման տերմինները կամ նիշերի կոդավորումը:

Քայլ 9: Վերնագրի պիտակ

Վերնագիր Պիտակ
Վերնագիր Պիտակ

Պիտակների միջև ՝ ներքևում, գրել և. Այսպիսով, ինչ որ միջանկյալ գրեք, այն կտեսնեք զննարկչի պատուհանի վերևում, և այս պիտակը կարևոր է որոնման համար: Օրինակ, ես պատրաստվում եմ գրել «WRD 204»

Քայլ 10: Պարբերության ավելացում `օգտագործելով P Tag- ը

Պարբերության ավելացում ՝ օգտագործելով P պիտակը
Պարբերության ավելացում ՝ օգտագործելով P պիտակը

Միջանկյալ գրեք ցանկացած տեղեկատվություն, որը ցանկանում եք տեսնել վեբ էջում, օրինակ ՝ նկար, աուդիո, վիդեո և պարբերություն, օրինակ, օրինակ, ես պարբերություն կգրեմ ՝ օգտագործելով այս պիտակները պարբերության համար.

եւ.

Քայլ 11: Տեսեք ձեր արդյունքները

Տեսեք ձեր արդյունքները
Տեսեք ձեր արդյունքները
Տեսեք ձեր արդյունքները
Տեսեք ձեր արդյունքները

Ձեր արդյունքները տեսնելու համար. Նախ աջ սեղմեք ֆայլի վրա և կտտացրեք «պահպանել», քան վերին աջ անկյունում գտնվող «կենդանի նախադիտման» պատկերակին:

Նշում.

Քայլ 12: Փոխեք ձևաչափումը

Փոխեք ձևաչափումը
Փոխեք ձևաչափումը
Փոխեք ձևաչափումը
Փոխեք ձևաչափումը

Եթե ցանկանում եք փոխել տեքստի ձևաչափի չափը, օգտագործեք որպես ամենամեծ վերնագիր կամ ամենափոքրը: Իմ օրինակում ես կօգտագործեմ:

Քայլ 13: Մեկ/երկգիծ ընդմիջման նշան

Մեկ/երկտողանի ընդմիջման պիտակ
Մեկ/երկտողանի ընդմիջման պիտակ
Մեկ/երկտողանի ընդմիջման պիտակ
Մեկ/երկտողանի ընդմիջման պիտակ

Եթե ցանկանում եք պարբերությունների միջև մեկ/կրկնակի տող ընդմիջում կատարել, օգտագործեք պիտակը

Քայլ 14: Եզրակացություն

Շնորհավորում եմ: այժմ կարող եք սկսել կառուցել ձեր սեփական վեբ էջը:

Եթե ձեզ հետաքրքիր է ավելին իմանալ HTML պիտակների մասին, խորհուրդ եմ տալիս այս կայքը ՝

Խորհուրդ ենք տալիս: