Html(HyperText Markup Language)


Download 0.78 Mb.
bet9/22
Sana05.01.2022
Hajmi0.78 Mb.
#232220
1   ...   5   6   7   8   9   10   11   12   ...   22
Bog'liq
HTML haqida

1-hujayra

2-hujayra

1-hujayra

2-hujayra

Xo'sh, CSS orqali men uni biroz tuzatdim:

Jadval (border-qulash: qulash;) td (chegara: 1px qizil rang; to'ldirish: 15px;)


Agar siz CSS nima ekanligini tushunmasangiz, men sizni bir vaqtning o'zida o'qishga taklif qilaman, barchasi darhol aniq bo'ladi.

Shakllar


Shakllar veb-saytlarni yaratishda ham juda muhimdir, chunki ular doimo ishlatiladi. Mening fikrimcha, blogda hali shakllar haqida oqilona maqola yo'q, shuning uchun yozish kerak. Ayni paytda, oddiy shaklni yarataylik:

Начало формы

Kirish: 
Parol: 


Men qoidalarga qo'shilaman 


Конец формы
Shaklning asosiy elementlari:

              1. forma - barcha maydonlar joylashtirilgan shakl konteynerining o'zi. Shakl to'g'ri ishlashi uchun u harakat va usul atributlarini ro'yxatdan o'tkazishi kerak, ammo bu allaqachon php tili bilan ishlaydi.

              2. kiritish - shakl maydoni, aynan qanday bo'lishi, tip atributidagi qiymatga bog'liq. Masalan, matn - bu oddiy matnni kiritish uchun maydon, parol - bu parolni kiritish uchun maydon, tasdiqlash qutisi - tasdiq belgisi, yuborish - bu formani yuborish tugmasi. Albatta, bularning barchasi qadriyatlar emas, lekin boshqalar haqida batafsilroq shakllar haqida alohida maqolada yozaman (yaqinda).

              3. Xo'sh, yordamchi elementlar. Bizning holatlarimizda bu matn va satr tanaffuslari.

Shakllarning imkoniyatlari, ayniqsa html5 kelishi bilan juda katta bo'ldi. Ularda cheksiz ko'p maydonlarni yaratishingiz, kerak bo'lganda belgilashingiz, naqshlarni o'rnatishingiz va h.k. Shunga qaramay, men bularning barchasi haqida alohida yozaman.

Blok va ichki elementlar

Umuman olganda html-dagi barcha elementlarni taxminan ikkita toifaga bo'lish mumkin: blok va inline. Kichik belgilarga quyidagilar kiradi, masalan: b (qalin), img (rasm), (havola) va boshqalar. Ya'ni, ular bir qatorda bir necha marta ishlatilishi mumkin.

Blocky - bu butunlay boshqa masala. O'z yo'nalishida bitta blok bo'lishi mumkin. Bloklarga misollar: paragraflar, jadvallar, ro'yxatlar. Ya'ni bitta satrda 2 ta xatboshi bo'lishi mumkin emas, to'g'rimi?

Html-da blok va ichki elementni boshqa xususiyatlarni bermasdan shunchaki belgilaydigan teglar mavjud. Ular span va div. Birinchisi inline, ikkinchisi esa blok. Ular har doim maketda ishlatiladi. Farqni tushunishga yordam berish uchun mana bir misol:

Matn


Matn

Matn


Matn Matn Matn

Ehtimol, bu veb-sayt yaratish uchun barcha asosiy HTML teglar bo'lib, ular doimo ishlatilib turiladi va siz bilishingiz kerak.

Asosiy HTML teglari deyarli har qanday veb-sayt / blog quriladigan bazadir. Ushbu maqoladan siz har doim kerak bo'ladigan teglarning 20 foizini aniq bilib olasiz.

Har qanday tilda bo'lgani kabi, bu erda ham Pareto 20/80 qoidasi amal qiladi (kerakli natijaga erishish uchun 20% hollarda 80% muhim ahamiyatga ega), demak sayt qurishda o'z maqsadlaringizga ishonchli erishish uchun kodlarning atigi 20 foizini bilish kifoya.

HTML dasturlash tili emas, chunki bu gipermatnni belgilash tili bo'lib, o'zi uchun gapiradi, bu to'g'ri ekran uchun sahifalardagi bloklarni belgilashga, veb-sahifalar uchun matnni belgilashga imkon beradi. Shuningdek, u saytning bir sahifasidan boshqasiga havolalar o'rnatadi. Internetdagi barcha havolalar html kodining gipermatnli qismi yordamida yaratiladi.

Eng ko'pmi eng sodda til! Agar siz uni o'rganishga qaror qilsangiz, unda boshidanoq bu juda qiyin emasligini tushunish muhimdir. Ishonch bilan aytishimiz mumkinki, bolalar uchun maktabda informatika darsini o'tkazish ancha qiyin.

Keling, boshlaymiz. Kodlarni daftarga yozib qo'yish yaxshidir standart dasturlar operatsion tizim Windows yoki bepul dastur "Notepad + +".

Birinchidan, teg nima ekanligini aniqlaylik. Teg - bu html tilining o'zi joylashgan hujayra bo'lib, u umuman tuziladi. Teglar bo'yicha brauzerlar matnni qanday ko'rsatishni, rasmlarni qaerga qo'shishni tushunadilar. Teglar belgilash elementlarining o'zi.

Skelet saytini yaratish uchun HTML teglari

Teglar juft yoki juftlashtirilishi mumkin. Juftliklar ochilib yopiladi, ya'ni yopiluvchilarda teskari "/" chiziq bor.

Har qanday narsada bo'lishi kerak bo'lgan birinchi narsa hTML hujjati blog sahifasini yaratishda quyidagilar:




              1. - brauzerga ularning orasidagi hamma narsa HTML kodi ekanligini ayting;

              2. - ingliz tilidan. "Head", qidiruv tizimlari uchun nom, kodlash, meta teglarni o'z ichiga oladi;

              3. - meta teg, asosan qidiruv tizimlari uchun, ichidagi hujjat nomini o'z ichiga oladi, brauzerning yuqori qismida ko'rsatiladi;

              4. - brauzerda kodlash tilini ko'rsatadigan bitta yorliq, bu erda windows-1251 ushbu sahifaning matni rus tilida ekanligini ko'rsatadi (windows-1252 - inglizcha uchun);

              5. - sayt kalit so'zlari uchun;

              6. - sahifaning qisqacha mazmuni;

              7. HUJJAT TANASI - ingliz tilidan. "Asosiy" saytning barcha sahifalarini o'z ichiga oladi.

Bular edi standart HTML teglari, bu bilan sayt / blogning barcha sahifalari o'zgarishsiz quyidagi shaklda boshlanishi kerak:

Sahifaning asosiy qismida joylashgan HTML teglari ro'yxati

Teglar orasida sayt sahifasining tanasi o'zi qaerda joylashgan bo'ladi:


              1. sarlavha

- eng muhimi 1 daraja;

              1. dan

subtitr

tomonidan



subtitr

- navbati bilan 2, 3, 4, 5 va 6-darajalarning pastki sarlavhalari;



              1. langar aloqalari - havola, bu erda "target \u003d" _ blank "" - bu yangi oynada ochilish uchun mas'ul bo'lgan atribut, "title \u003d" "- bu bog'lanishning nomi;

              2. va qalin teglar. "" Eskirgan va foydalanish tavsiya etiladi " »;

              3. - kursiv bilan yozish;

              4.  - rasmni sahifaga kiritish uchun javobgar bo'lgan bitta yorliq;

              5. - ingliz tilidan "p". "Paragraf", bu matnni paragraflarga ajratishini anglatadi. Chap sukut bo'yicha oqlandi;
              6. - chiziqning oxiri va keyingisiga o'tishni ko'rsatadigan mantiqiy yorliq;



              7. - matnni markazga moslashtiruvchi atribut;

              8. - o'ng tomonga moslashtiruvchi matn atributi;



              9. color \u003d "green" matnning rangi uchun javobgardir. Bunday holda, u yashil rangga ega. "Yashil" so'zining o'rniga odatda o'n oltinchi rang tizimidan kod qo'yiladi, masalan: "# 088f47";

              10. face \u003d "verdana" - matndagi shriftni ko'rsatadigan atribut;

              11. size \u003d "3" - shrift hajmi;



                1. birinchi

                2. ikkinchi

                3. uchinchi

- raqamlangan ro'yxat;



                1. so'z

                2. so'z

                3. so'z

- markirovka qilingan ro'yxat;

Jadval yaratish uchun HTML teglar

Jadvalning o'zida juda ko'p teglar bo'lishi mumkin, bu jadval chegarasi rangidagi o'zgarishlar, jadval ichidagi so'zlarning bir-biriga mos kelishi va boshqalar, ammo maqola asosiy teglar haqida bo'lgani uchun biz faqat jadvalni o'zi yaratgan teglar haqida to'xtalamiz.






- jadval yaratish uchun mas'ul yorliq, bu erda "1" jadval chegarasining kengligi, bu erda "450" \u200b\u200bjadvalning kengligi va siz allaqachon "markaz" ni bilasiz;

              1. - ichida joylashgan yorliq "



»Va jadvalda qator hosil qiladi;

              1. - ketma-ket ustun yaratadi, teglar ichida " ". "150", siz taxmin qilganingizdek, ustun kengligi;

To'liq hTML jadval teglari shunga o'xshash narsaga qarang:


hujayra №1

hujayra raqami 2

hujayra № 3

№4 hujayra

5-uy

hujayra № 6

Shuni ta'kidlaymanki, bu html kodining asosiy teglari va siz unga juda ko'p o'zgartirishlar kiritishingiz mumkin. Shuni ham ta'kidlash joizki, html kodining o'zi shablon, CSS holda, umuman, bunga arziydigan narsa imkonsiz bo'ladi. Faqat barchasi birgalikda HTML va CSS mo''jizalar yaratadi, ammo oddiy narsalarni CSS-ni chuqur bilmasdan, html-da bajarish mumkin.

Mavzu bo'yicha video ko'rsatma - “HTML nima? HTML fayli indeks ":

Agar sizga yoqqan bo'lsa, ulashing:

Siz ko'proq bilishni xohlashingiz mumkin:




Ba'zi html teglariga sharhlar berilgan oddiy sahifani yaratish misolini ko'rib chiqdik, chunki menga avval nimadir misol bilan ko'rsatib, so'ngra batafsilroq tavsifga o'tish yaxshiroqdir. Shu sababli sahifalarni yaratish ikkinchi darsda, uchinchisida esa batafsilroq yoritilgan.

Shunday qilib, quyida saytning deyarli har bir sahifasida ishlatiladigan keng tarqalgan HTML teglarining tavsiflari keltirilgan. Ishoning, ularning barchasi butun veb-sayt yozish uchun etarli.

HTML teglari ro'yxati

1. HTML yorlig'i (paragraflar uchun)

- matnli xatboshini namoyish etadi (atributlar uslubiga, sinfiga, idiga ruxsat beradi) Eng keng tarqalgan yorliq, chunki matn ko'pincha unga joylashtiriladi (garchi u buning uchun yaratilgan bo'lsa ham).

Masalan, HTML kodi:

Birinchi raqamli xat xatini yuboring

Va bu yana bir xatboshi

Birinchi raqamli xat xatini yuboring

Va bu yana bir xatboshi

Shuningdek, stil parametrini tegga qo'shishingiz mumkin:

Ushbu turli xil qiymatlar yordamida siz shrift ko'rinishini tahrirlashingiz mumkin. Ushbu parametrlar haqida alohida darsda o'qishingiz mumkin: html-dagi uslublar va CSS shrift xususiyati.

Shuningdek, siz CLASS va ID atributlarini ro'yxatdan o'tkazishingiz mumkin. Masalan:

2. HTML yorlig'i va (qalin)

VA - shriftni qalin qilish uchun ikkita teg. Ushbu teglar o'rtasida hech qanday farq yo'q.

Keling, bir misol keltiraylik. HTML kodi:

kichik rasm

Sahifada quyidagilarga aylantirildi:

kichik rasm

Shuningdek, siz CLASS va ID atributlarini ro'yxatdan o'tkazishingiz mumkin (Izohda bo'lgani kabi)

Ushbu teglar qidiruv tizimlaridagi hujjatlar reytingiga unchalik ta'sir qilmaydi, shuning uchun ularni maqsadsiz ishlatmaslik yaxshiroqdir.

3. HTML yorlig'i (kursivni yarating)


Download 0.78 Mb.

Do'stlaringiz bilan baham:
1   ...   5   6   7   8   9   10   11   12   ...   22




Ma'lumotlar bazasi mualliflik huquqi bilan himoyalangan ©fayllar.org 2024
ma'muriyatiga murojaat qiling