HTML хэлний бүрэн синтакс. PHP синтакс. HTML үндэс

HTML нь HyperText Markup Language гэсэн үгийн товчлол:

• хэл гэдэг нь хүн болон компьютерийн аль алинд нь уншиж болно гэсэн үг;
• тэмдэглэгээ гэдэг нь таны бичсэн кодыг түлхүүр үгээр тэмдэглэсэн гэсэн үг;
• гипертекст гэдэг нь HTTP-г интернетийн нэг хэсэг болгон ашигладаг гэсэн үг.

Аливаа хэлний нэгэн адил HTML нь дүрэм журмын дагуу ирдэг. Эдгээр дүрмүүд нь харьцангуй энгийн бөгөөд аливаа зүйл хаанаас эхэлж, хаана дуусахыг мэдэхийн тулд хил хязгаарыг тодорхойлоход хүргэдэг.

HTML хэл дээрх догол мөрийн жишээг доор харуулав.

Та өнцгийн хаалтанд юу харж байна< и >HTML таг гэж нэрлэдэг. Тэд ямар нэг зүйл хаанаас эхэлж, хаана дуусахыг тодорхойлдог.

Би аль хэдийн олсон HTML лавлагаа бүхий нийтлэл үүсгэсэн бүрэн жагсаалтбүх шошго ба тэдгээрийн утга. Энэ нийтлэлийн холбоос -

Шошго бүр нь тодорхой утгатай. Манай тохиолдолд энэ нь текстийн догол мөр гэсэн үг юм.

Дүрмээр бол тэд хосоороо ирдэг:

• нээлтийн шошго нь догол мөрийн эхлэлийг тодорхойлдог;
• хаалтын шошго
  түүний төгсгөлийг тодорхойлдог.

Тагуудыг нээх, хаах хоёрын цорын ганц ялгаа нь шошгоны нэрний өмнөх налуу зураас / тэмдэг юм.

Нээлтийн шошго, хаалтын таг болон тэдгээрийн хоорондох бүх зүйлийг нэгтгэх үед та HTML элементийг авах болно.

Хэрэв та энэ жишээг хөтөч дээрээ харвал үүнийг анзаарах болно HTML шошгохөтөч дээр харагдахгүй байна. Та ямар төрлийн контент бичсэнийг мэдэхийн тулд тэдгээрийг зөвхөн хөтөч уншдаг.

Бүх шошго нь inline болон блок гэсэн 2 төрөлд хуваагдана.

Блоклох элементүүд:

• догол мөр;
• жагсаалт: дараалалгүй (сумтай)
  эсвэл захиалгат жагсаалт (тоотой);
  • Гарчиг: эхний түвшнээс зургаа дахь шат хүртэл;
  • нийтлэл ;
  • хэсгүүд;
  • урт ишлэлүүд.

  Дотор элементүүд нь:

  • холбоосууд ;
  • онцолсон үгс;
  • чухал үгс;
  • богино ишлэл;
  • товчлол.

  Блок элементүүд нь агуулгыг логикоор холбогдсон блокуудад хуваах замаар таны хуудасны үндсэн хэсгүүдийг бүтэцжүүлэхэд зориулагдсан.

  Дотор элементүүд нь текстийн тодорхой хэсгийг хязгаарлаж, түүнд тодорхой үүрэг, утгыг өгөх зорилготой юм. Дотор элементүүд нь ихэвчлэн нэг буюу хэд хэдэн үг агуулдаг.

  Атрибутууд

  Шошгууд нь шинж чанаруудыг агуулж болно - шошгоны үйлдлийг өргөжүүлэх тусгай тушаалууд. Зарим шошгоны хувьд тэдгээр нь зөв ажиллах шаардлагатай байдаг. Жишээлбэл, холбоосыг заасан хаяг руу хөтлөхийн тулд нэмэлт шинж чанар нэмэх шаардлагатай. Холбоос дараах байдлаар харагдах болно.

  Нээлтийн таг дотор шинж чанаруудыг дараах форматаар байрлуулна: .

  Ишлэл нь юу ч байж болно - дан эсвэл давхар шинж чанарын утга нь нэг үгээс бүрдсэн бол тэдгээрийг огт оруулахгүй байхыг зөвшөөрнө (гэхдээ үүнийг зөвлөдөггүй).

  HTML хаана бичих вэ

  Та .txt өргөтгөлтэй энгийн текст файлуудтай таарсан байх. Ийм байхын тулд текст файл HTML баримт бичиг болсон (текст баримтын оронд) та .html өргөтгөлийг ашиглах хэрэгтэй.

  Зарчмын хувьд HTML-тэй ажиллахын тулд та ердийн програмыг ашиглаж болно Текст баримт, энэ нь компьютер бүрт стандарт байдаг. Үүнийг хийхийн тулд та үүсгэх хэрэгтэй шинэ баримт бичиг, кодыг нь бичээд .html форматаар хадгална.

  Хамтран ажиллахын тулд HTML файлуудЭнэ нь тохиромжтой байсан тул та ийм төрлийн файлтай ажиллахад зориулагдсан тусгай засварлагч ашиглаж болно. Ийм нэг редактор байна Гайхамшигтай текст 3, би энэ тухай өмнөх нийтлэлүүддээ аль хэдийн бичсэн. Бичлэгийн холбоос энд байна -

  Файлд юу бичих вэ

  Хөтөч дээр өөрийн сайтыг нүдээр харахын тулд сайтын файлд дараах кодыг бичих шаардлагатай.

  Энэ бол HTML ашиглан вэб хуудас бичихэд хэрэглэгддэг үндсэн загвар юм. Үүнийг нарийвчлан авч үзье.

  • - энэ бол бидний юу ашиглаж байгааг хөтчид хэлдэг код юм Хамгийн сүүлийн үеийн хувилбар HTML - HTML5
  • - энэ шошгон дотор сайтын ажиллагааг хариуцдаг бүх шошгууд байдаг. Энд бид гуравдагч талын файлуудыг оруулах, скрипт оруулах, кодчилолуудыг зааж өгөх гэх мэт олон зүйлийг багтаасан болно
  • body – энэ шошгон дотор харагдах хаягууд байгаа бөгөөд тэдгээрийн ажлыг нүдээр харах боломжтой.

  Код хэрхэн ажилладагийг нүдээр харж, текстийг харуулахыг хичээцгээе.

  Миний анхны сайт

  Энэ бол миний анхны сайт!

  Та эдгээр шошго бүрийг хаах шошгоор яаж сольж болох вэ, энэ тухай бидний өмнө нь ярьсан. HTML кодын бүх бүтэц нь "матрешка хүүхэлдэй"-тэй төстэй юм. Нэг шошго нь нөгөөгийн дотор байрладаг.

  Энэ систем нь тусгай шатлалтай. Энэ системд хаягууд нь ах дүүгийн таг, эцэг эх, өвөг дээдсийн таг гэж хуваагддаг. Энд бүх зүйл харьцангуй, шошго бүр өөрийн өвөг дээдэс, эцэг эх, ах нартай байх болно.

  Эцэг эх нь тухайн шошгыг агуулсан шошго юм.

  Өвөг дээдэс нь тухайн шошгон дотор байрлах хаягууд юм.

  Ах шошгууд нь тухайн шошготой ижил түвшинд байгаа шошгууд юм.

  Энэ жишээнээс энэ холболтыг ойлгоход хялбар болно:

  Алдарт хөлбөмбөгийн ишлэлүүд Сэр Алекс Фергюсон нэгэнтээ Филиппо Инзагийн тухай хэлсэн байдаг: Энэ залуу офсайд төрсөн байх ёстой. Жон Карьюг шүүмжилэхэд Златан Ибрагимович хариулахдаа: Карью бөмбөгөөр хийсэн зүйлийг би жүржээр хийж чадна. Жорж Бест хэлэхдээ: Би архи, охид, хурдан машинд маш их мөнгө зарцуулсан. Үлдсэнийг нь үрэн таран хийсэн” гэж түүний амьдралын хэв маягийг асуухад хариулав.

  Энэ бүтцэд:

  • бусад элементийн өвөг дээдэс юм;
  • эцэг эх нь гурван ;
  • мөн гурвуулаа бие биетэйгээ ах дүүс;
  • тус бүр нь эцэг эх бөгөөд тэдгээрт агуулагддаг;
  • бүр,

    , ба - эдгээр нь бүгд үр удам юм.

  Гэр бүлийн модны зүйрлэл нь HTML хавсралтын олон давхаргыг үзэхэд мөн хамаарна:

  • X элементийн хүүхэд нь аливаа элемент юм дотор X;
  • хүүхэд бол энгийн Чигээрээүр удам;
  • Y элементийн өвөг нь аливаа элемент;
  • эцэг эх нь зөвхөн эхнийх нь юм Чигээрээөвөг дээдэс.
  Энэ хичээлээс бид юу сурсан бэ
• HTML нь мэдээллийг хадгалж, вэбсайтын хуудсан дээр харуулдаг шошготой болохыг бид олж мэдсэн. Шошго бүр нь тодорхой утгатай.
• HTML-тэй ажиллахад .html нягтралтай файлуудыг ашигладаг. HTML-тэй ажиллахын тулд та шинэ баримт үүсгэж, түүнд код бичиж, .html форматаар хадгалах хэрэгтэй.
• HTML нь тусгай шатлалтай байдаг. Шошгуудыг ах дүү, эцэг эх, өвөг дээдсийн шошго гэж хуваадаг. Энд бүх зүйл харьцангуй, шошго бүр өөрийн өвөг дээдэс, эцэг эх, ах нартай байх болно.

HTML хаягууд нь HTML хэлний үндэс суурь болдог. Шошго нь тэмдэглэгээний элементүүдийн эхлэл ба төгсгөлийг зааглахад ашиглагддаг.

HTML баримт бичиг бүр нь HTML элементүүд болон текстийн модноос бүрдэнэ. HTML элемент бүрийг эхлэх (нээх) ба төгсгөлийн (хаах) тагаар тодорхойлно. Нээх, хаах шошгууд нь шошгоны нэрийг агуулна.

Бүх HTML элементүүдийг таван төрөлд хуваадаг:

• хоосон элементүүд - , ,
  , , , , , , , , , , , , ;
• форматлагдаагүй текст бүхий элементүүд - , ;
• форматлагдаагүй текстийг харуулсан элементүүд - , ;
• өөр нэрийн орон зайн элементүүд - MathML болон SVG;
• энгийн элементүүд - бусад бүх элементүүд.

Хүснэгт нь HTML4 болон HTML5-ээр дэмжигдсэн элементүүдийн бүрэн жагсаалтыг өгдөг. Туршилтын болон хуучин шошгуудыг хассан. HTML5-ийн тодорхойлолтод нэмсэн элементүүдийг цайвар өнгөөр ​​тодруулсан.

HTML элементүүдийн бүрэн жагсаалт Хүснэгт 1. HTML элементүүд Шошго тайлбар

	Сэтгэгдэл нэмэхэд ашигладаг.
	Баримт бичгийн төрлийг зарлаж, хөтөч дээр үндсэн мэдээллээр хангадаг - түүний хэл, хувилбар.
	Гипертекст холбоос үүсгэдэг.
	Текстийг товчлол эсвэл товчилсон үг гэж тодорхойлдог. Тайлбар текстийг гарчгийн шинж чанарыг ашиглан зааж өгсөн болно.
	Баримт бичиг эсвэл нийтлэлийн зохиогч/эзэмшигчтэй холбоо барих мэдээллийг зааж өгнө. Хөтөч дээр налуу үсгээр харагдана.
	Энэ нь зургийн газрын зураг дээрх тодорхой хэсэг эсвэл зургийн газрын зураг доторх идэвхтэй хэсэгт харгалзах текст бүхий гипер холбоос юм. Үргэлж шошгон дотор байрладаг.
	Сэтгүүлийн нийтлэл, блог нийтлэл, сэтгэгдэл гэх мэт баримт бичиг эсвэл вэбсайтын бие даасан хэсгийг бүрдүүлдэг агуулгын хэсэг.
	Хуудас/сайтын үндсэн агуулгатай шууд бусаар холбоотой хуудасны агуулгыг илэрхийлнэ.
	Аудио контентыг вэб хуудсанд ачаална.
	Тодруулсан бичвэрт тодотгол, ач холбогдол нэмэлгүйгээр текстийн хэсгийг тод харагдуулахаар тохируулна.
	Бүх харьцангуй хаягийг тооцоолох үндсэн хаягийг (URL) заана. Энэ нь хуудсыг өөр газар шилжүүлэхэд асуудал гарахаас зайлсхийхэд тусална, учир нь бүх холбоосууд өмнөх шигээ ажиллах болно.
	Текстийг баруунаас зүүн тийш уншдаг хэлээр бичсэн текстийн хэсгийг бусад хэсгээс тусгаарлана.
	Текстийг dir атрибутаар заасан чиглэлийн дагуу харуулж, одоогийн текстийн чиглэлийг дарна.
	Текстийг эшлэл болгон тодруулж, том эшлэлийг тодорхойлоход ашигладаг.
	Баримт бичгийн үндсэн хэсгийг төлөөлдөг (баримт бичгийн мета өгөгдлийн хэсэг биш агуулга).
	Текстийг шинэ мөрөнд боож өгнө үү.
	Интерактив товчлуур үүсгэдэг. Та шошго дотор агуулгыг байрлуулж болно - текст эсвэл зураг.
	Энгийн зураг, диаграмм, график гэх мэт зургийг динамикаар харуулах зориулалттай канвас сав. JavaScript скрипт хэлийг зурахад ашигладаг.
	Хүснэгтэнд тайлбар нэмнэ. Шошгоны дараа шууд оруулсан . Ишлэлийн эх сурвалжийг зааж өгөхөд ашигладаг. Налуу үсгээр харуулав. Monospace фонтын гэр бүлд харуулсан програмын кодын хэсгийг төлөөлдөг. Нэг төрлийн мэдээлэл агуулаагүй форматлах хүснэгтийн нэг буюу хэд хэдэн баганыг сонгоно. Логикийн хувьд нэг төрлийн олон нүдийг тодорхойлсон бүтцийн бүлгийг баганын үүсгэнэ. Энэ элемент нь утгын атрибутын утгыг машинд уншигдахуйц форматтай, компьютерээр боловсруулах боломжтой, шошгоны агуулгатай холбоход хэрэглэгддэг. Унждаг жагсаалтын элементийн контейнер элемент. Вариант утгыг элементүүдэд байрлуулсан. Тагнаас нэр томъёог тодорхойлоход ашигладаг. Текстийг зурж устгасан гэж тэмдэглэнэ. Хэрэглэгч нээх эсвэл хаах боломжтой интерактив виджетийг үүсгэнэ. Агуулгын агуулахыг төлөөлдөг бөгөөд виджетийн харагдах нэрийг шошгонд байрлуулсан болно. Үгийг налуу үсгээр бичиж нэр томьёо гэж тодорхойлдог. Дараах текст нь энэ нэр томъёоны тодорхойлолтыг агуулсан байх ёстой. Харилцах цонх, шалгагч эсвэл цонх гэх мэт даалгаврыг гүйцэтгэхийн тулд хэрэглэгч харилцдаг интерактив элемент. Нээлттэй шинж чанаргүй бол энэ нь хэрэглэгчдэд харагдахгүй. HTML баримтын хэсгүүдэд зориулсан контейнер шошго. Бүлэглэхэд ашигладаг блок элементүүдхэв маягаар форматлах зорилгоор. Нэр томьёо болон түүний тайлбарыг агуулсан савны шошго. Нэр томъёог тодорхойлоход ашигладаг. Текстийн чухал хэсгүүдийг налуу үсгээр харуулах замаар тодруулна. Гадны интерактив контент эсвэл залгаасыг оруулах зориулалттай савны шошго. Маягт дахь холбогдох элементүүдийг тойруулан хайрцаг зурж бүлэглэнэ. Элементийн гарчиг/гарчиг. Дүрслэл, диаграмм, гэрэл зураг, кодын жишээ гэх мэт агуулгын хувьд бие даасан савны шошго, ихэвчлэн тайлбартай. Баримт бичиг эсвэл хэсгийн төгсгөлийн хэсгийг (хөл хэсэг) тодорхойлно. Хэрэглэгчээс сервер рүү мэдээлэл цуглуулах, илгээх маягт. Үйлдлийн шинж чанаргүйгээр ажиллахгүй. Холбогдох хэсгүүдийн зургаан түвшний гарчиг үүсгэ. , , , , гэх мэт HTML баримтын мета өгөгдөлд зориулсан контейнер элемент. Сайтын танилцуулга эсвэл навигацийн холбоосын хэсэг. Нэг буюу хэд хэдэн гарчиг, лого, зохиогчийн талаарх мэдээллийг агуулж болно. Догол мөрүүдийг сэдэвчилсэн хуваах хэвтээ шугам. HTML баримт бичгийн үндсэн элемент. Энэ нь HTML баримт бичиг гэдгийг хөтчид хэлнэ. Энэ нь бусад бүх html элементүүдэд зориулсан контейнер юм. Текстийн хэсгийг нэмэлт онцлохгүйгээр налуу бичнэ. Одоогийн HTML баримт бичигт өөр баримтыг ачаалснаар шугаман хүрээ үүсгэнэ. src атрибутыг ашиглан HTML баримт бичигт зургуудыг оруулдаг бөгөөд утга нь суулгагдсан зургийн URL юм. Хэрэглэгч өгөгдөл оруулах боломжтой баялаг хэлбэрийн талбаруудыг үүсгэдэг. Текстийг доогуур зураасаар тодруулна. Баримт бичигт хийсэн өөрчлөлтийг тодруулахад ашигладаг. Хэрэглэгчийн гарыг ашиглан моноспей фонтоор оруулах текстийг сонгоно. Хуудасны талаарх нэмэлт мэдээллийг хадгалахад ашигладаг. Хөтөчүүд энэ мэдээллийг ашиглан хуудсыг боловсруулах, мөн Хайлтын системүүд- индексжүүлснийх нь төлөө. Блок дотор хэд хэдэн шошго байж болно, учир нь ашигласан шинж чанараас хамааран тэдгээр нь өөр өөр мэдээлэл агуулдаг. Өгөгдсөн муж дахь хэмжилтийн үзүүлэлт. Сайтын навигацийн холбоосыг агуулсан баримт бичгийн хэсэг. Скриптийг дэмждэггүй хэсгийг тодорхойлно. Мультимедиа (жишээ нь, аудио, видео, Java апплет, ActiveX, PDF болон Flash) оруулах зориулалттай контейнер. Та одоогийн HTML баримт бичигт өөр вэб хуудас оруулах боломжтой. Таг нь залгаасын параметрүүдийг дамжуулахад хэрэглэгддэг. Дараалсан дугаарласан жагсаалт. Дугаарлах нь тоон болон цагаан толгойн үсгээр байж болно. Бүлэг элементийн гарчигтай сав. , эсвэл , унадаг жагсаалтаас сонгох сонголт/сонголтыг зааж өгнө. Скрипт ашиглан тооцоолсон тооцооллын үр дүнг харуулах талбар. Текст дэх догол мөрүүд. Элемент ашиглан бүтээсэн залгаасуудын параметрүүдийг тодорхойлдог. Нэг элемент агуулсан савны элемент мөн тэг буюу түүнээс дээш элемент. Энэ нь өөрөө юу ч харуулахгүй. Хөтөч нь хамгийн тохиромжтой зургийг сонгох боломжийг олгодог. Текстийг форматлахгүйгээр гаргана, хоосон зай, текстийн завсарлага хадгална. Компьютерийн код, мессежийг харуулахад ашиглаж болно Имэйлгэх мэт. Аливаа төрлийн ажлыг дуусгах үзүүлэлт. Богино эшлэлийг тодорхойлдог. Зүүн Азийн бэлгэдэл, тэдгээрийн кодыг тайлах сав. Өөрийн оруулсан текстийг тэмдэглэгээний үндсэн бүрэлдэхүүн хэсэг болгон тодорхойлдог. Нэмдэг Товч танилцуулгаэлементэд агуулагдах тэмдэгтүүдийн дээр эсвэл доор, жижиг фонтоор харуулна. Суулгасан текстийг нэмэлт тайлбар болгон тэмдэглэнэ. Хөтөч энэ элементийг дэмждэггүй бол өөр текстийг харуулна. Одоогийн биш текстийг зураасаар харуулна. Програмын код эсвэл скриптийн гүйцэтгэлийн үр дүнг харуулсан текст болон системийн мессежийг харуулахад ашигладаг. Нэг орон зайн фонтоор харуулав. Үйлчлүүлэгч талын скриптийг (ихэвчлэн JavaScript) тодорхойлоход ашигладаг. Скриптийн текст эсвэл цэгийг агуулна гадаад файл src шинж чанарыг ашиглан скрипт. Хуудасны логик талбар (хэсэг) -ийг ихэвчлэн толгойгоор тодорхойлдог. Санал болгож буй багцаас утгыг сонгох боломжийг олгодог хяналтын элемент. Хувилбарын утгуудыг байрлуулсан. Текстийг жижиг үсгийн хэмжээгээр харуулна. , , -д зориулсан өөр медиа нөөцийн байршил, төрлийг зааж өгнө. Дотор элементүүдэд зориулсан сав. Бие даасан үгсийг өнгөөр ​​тодруулах гэх мэт текстийн хэсгүүдийг форматлахад ашиглаж болно. Текстэд онцлон тэмдэглэж, тодоор тодруулна. Оруулсан загварын хуудаснууд багтсан. Химийн томьёо дахь элементийн индекс гэх мэт тэмдэгтүүдийн дэд бичвэрийг зааж өгдөг. Шошгонд харагдахуйц гарчиг үүсгэдэг. Дүүргэгдсэн гурвалжин дүрслэгдсэн бөгөөд үүн дээр дарснаар гарчгийн дэлгэрэнгүй мэдээллийг харах боломжтой. Тэмдэгтүүдийн үсгийн үсгийг зааж өгнө. Хүснэгт үүсгэх шошго. Хүснэгтийн үндсэн хэсгийг тодорхойлно. Хүснэгтийн нүдийг үүсгэдэг. Скриптээр хуулбарлаж, баримт бичигт оруулах боломжтой HTML кодын фрагментуудыг зарлахад ашигладаг. Тагийн агуулга нь түүний хүүхэд биш юм. Том текст оруулах талбаруудыг үүсгэдэг. Хүснэгтийн хөлийг тодорхойлно. Хүснэгтийн нүдний гарчиг үүсгэдэг. Хүснэгтийн гарчгийг тодорхойлно. Огноо/цагийг тодорхойлно. Хөтөчийн гарчгийн мөрний дээд хэсэгт харагдах HTML баримт бичгийн гарчиг. Хайлтын үр дүнд бас гарч ирж магадгүй тул гарчиг өгөхдөө үүнийг анхаарч үзэх хэрэгтэй. Хүснэгтийн мөр үүсгэнэ. Элементүүдэд хадмал орчуулга нэмнэ. Текстийн хэсгийг нэмэлт тодотголгүйгээр доогуур зураасаар тодруулна. Сумтай жагсаалт үүсгэдэг. Програмын хувьсагчдыг налуу үсгээр харуулах замаар тодруулна. Хуудас руу видео файл нэмнэ. MP4, WebM, Ogg гэсэн 3 видео форматыг дэмждэг. Хөтөч рүү урт мөр тасарч болохыг заана. Шошго бүхий хуурамч хуудас Ашиглахад хялбар болгох үүднээс би шошгуудыг сэдэвчилсэн хэсгүүдэд бүлэглэж, шошго тус бүрийн дэлгэцийн шинж чанарыг нэмсэн. Хүснэгт рүү очихын тулд зураг дээр дарна уу. HTML синтакс Цагаан будаа. 1.6. Вэб хөтөч дээр энгийн HTML хуудсыг харуулах HTML хэлний үндсэн дүрмүүд HTML шошгоны нэр нь жижиг үсгээр бичигдсэн байх ёстой бөгөөд XHTML-д жижиг, том үсгийг өөр гэж үздэг бөгөөд шошгоны нэрийг жижиг үсгээр бичих ёстой. Элементүүд нь текст болон дэд элементүүдийг (жишээ нь html элементдээрх жишээнд байгаа толгой ба биеийн дэд элементүүдийг агуулна). Элементүүдийг зөв байрлуулсан байх ёстой. Элементэд багтсан дэд элементүүд нь элементийн хаалтын түгжрэлээс өмнө дуусах ёстой. Жишээлбэл, дараах оруулга буруу байна: Зөв, энэ фрагмент дараах байдлаар харагдах ёстой. Энэ бол тод, налуу текст юм XHTML-д хэрэв элемент нь текст болон дэд элементүүдийг (хоосон элемент) агуулаагүй бол нээх, хаах тагтай байх ёстой. Жишээлбэл, br элемент нь ямар ч агуулгагүй бөгөөд мөр таслах шалтгаан болдог (текст нь шинэ шугам). Гэсэн хэдий ч дүрмийн дагуу үүнийг дараах байдлаар бичих ёстой. эсвэл товчхондоо . Элемент - хэвтээ шугамын гаралт - яг ижил байдлаар бичигдсэн байх ёстой. Элемент нээх шошгууд байж болно шинж чанарууд,элементийн зан төлөвийг тодруулж, нэмэлт утгыг тогтоодог. Бараг бүх шошго байдаг том тоонэмэлт параметрүүд. Дараа нь зөвхөн шошгоны үндсэн шинж чанаруудыг авч үзэх болно. HTML дэх олон шинж чанарууд нь бүх элементүүдэд нийтлэг байдаг боловч зарим нь тухайн элемент эсвэл элементүүдэд зориулагдсан байдаг. Тэд бүгд дараах хэлбэртэй байна: attribute_name = "утга" Жишээлбэл: Гипертекст тэмдэглэгээний хэлний үндэс" IN энэ жишээнд div элемент (баримт бичгийг логик блок болгон салгах боломжийг олгодог HTML хуудасны хэсэг) mySection-д тохируулсан id атрибуттай. Div элемент нь h1 элементийг (эхний буюу хамгийн чухал түвшний гарчиг) агуулдаг бөгөөд энэ нь эргээд зарим текстийг агуулна. Атрибутын утгыг дан эсвэл давхар хашилтанд оруулах ёстой. Шошго, шинж чанаруудын нэр, тэдгээрийн боломжит утгыг HTML хэлний тодорхойлолтоор тодорхойлдог бөгөөд та өөрийн шошго эсвэл шинж чанарыг үүсгэх боломжгүй. Бүх элементүүд нь id болон ангиллын шинж чанаруудтай байж болох бөгөөд тэдгээрийн утгууд нь тодорхой элементүүд (id) эсвэл элементүүдийн бүлгүүдийг (анги) тодорхойлоход ашиглагддаг. Эдгээр шинж чанаруудыг баримт бичгийн скрипт болон тайлбарт идэвхтэй ашигладаг CSS загваруудбаримт бичиг. HTML-д элементүүдийн хоёр үндсэн ангилал байдаг: блокТэгээд мөр Блок элементүүдихэвчлэн баримт бичгийн бүтцийн талаар мэдээлдэг. Ийм элементүүд нь өмнөхөөсөө салж, шинэ мөрөнд эхэлдэг. Блок элементүүдийн жишээнүүд догол мөр, жагсаалтын зүйлс, толгой хэсэг болон хүснэгтүүд, div контейнер. Мөрийн элементүүдблок түвшний бүтцийн элементүүдэд агуулагдах ба баримт бичгийн текстийн бүх хэсгийг биш зөвхөн хэсгийг хамарна. Дотор элемент нь текстийн догол мөрөнд харагдах элементүүд тул баримт бичигт шинэ мөр гарч ирэхэд хүргэдэггүй. Мөрийн элементүүдийн жишээнүүд холбоосууд, тодруулсан үг, хэллэгүүд, багтаамжтай. Аливаа хэлэнд синтакс байдаг, өөрөөр хэлбэл. тухайн хэл дээрх утга учиртай өгүүлбэрийг тодорхойлох боломжийг олгодог хэлцийг бүтээх дүрмийн багц. Бид эдгээр дүрмийг судалж HTML хэлийг судалж эхлэх болно. Эхлээд Dremweaver програмаа нээгээд ердийн визуал горимд энгийн HTML баримт бичгийг үүсгэцгээе. Манай баримт бичигт ямар HTML код тохирохыг харцгаая. Таны санаж байгаагаар HTML код харах горимд шилжих нь Code View товчийг ашиглан хийгддэг. Dremweaver нь өөр горимтой, ялангуяа том дэлгэцтэй бол энэ нь код болон холбогдох баримт бичгийг нэгэн зэрэг харуулдаг "завсрын" горим юм тодорхой фрагментийг визуал горимд нэн даруй HTML кодын горимд харна уу. Тиймээс та HTML-д биднийх байгааг анзаарах болно. эх текстцэвэр хэлбэрээр, үүнээс гадна маш олон ойлгомжгүй үгсийг өнцгийн хаалтанд оруулсан болно. Эдгээр үл ойлгогдох бүтэц нь манай хэлний үндсэн барилгын материал юм. Тэдгээрийг шошго гэж нэрлэдэг. Шошго нь өнцгийн хаалтанд орсон шошгоны нэрээс бүрдэнэ. Шошгоны нэрийг жижиг болон том үсгээр бичиж болно - энэ нь хамаагүй. Хэрэв та анхааралтай ажиглавал олон шошгоны "нөгөө тал" нь ташуу зураастай байгааг анзаарах болно. Ийм "хос" нь бидний "утга утгатай" текстийн хэсгүүдийг тойрон хүрээлж байна. Жишээлбэл, гарчиг нь шошгуудаар хүрээлэгдсэн, догол мөр нь шошгуудаар хүрээлэгдсэн байдаг. Энэ загварыг Элемент гэж нэрлэдэг. Элемент нь тэмдэглэгээний нэгж юм. Элемент нь нээлтийн таг, өгөгдөл (өөрөөр хэлбэл агуулгын мэдээлэл) болон хаалтын тагнаас бүрдэнэ. Тиймээс шошгоны зорилго нь элементүүдийн хил хязгаарыг тэмдэглэх явдал юм. Текстийн байршлыг өөрчлөхийг оролдъё: жишээлбэл, элементийн оронд гарчгийг элементэд хавсаргая. Бид кодонд ямар нэг зүйлийг өөрчлөхөд өөрчлөлтүүд шууд харагдах горимд харагдахгүй, харин шинж чанаруудын самбар дээр бид кодыг өөрчилсөн гэсэн мессеж гарч ирэх бөгөөд өөрчлөлтийг харахын тулд та "шинэчлэх" товчийг дарах хэрэгтэй. "F5" товчлуур. Гарчгийн оронд бид текстийн ердийн догол мөрийг авсан. Баяр хүргэе! Та HTML кодыг гараар засварлах эхний алхамыг хийлээ. Текстийг элемент болгон тэмдэглэхдээ нээлтийн шошго нь ижил хаалтын шошготой таарч байх нь маш чухал юм. Хэрэв бид нээлтийн шошгыг өөрчлөх байсан бол Гэхдээ тэд хаалтын хэсгийг орхисон - энэ нь ноцтой алдаа байх байсан. Dreamweaver ийм алдааг "барьж" бидэнд мэдээлэх боломжтой. Хаалтын шошгыг зааж өгөх шаардлагагүй элементүүд байдаг. Жишээлбэл, ийм элемент нь P элемент юм. Эхний догол мөрийн төгсгөлийг хоёр дахь хэсгийн эхэнд зааж болно. Зөвхөн нээх тагнаас бүрдэх хаалтын тагтай огт байхгүй элементүүд байдаг. Энэ нь тухайн элемент нь текстийг тэмдэглэх зорилготой биш, харин бие даасан семантик ачааллыг агуулсан тохиолдолд тохиолддог. Жишээлбэл, зураг, элемент . Элементүүдийг бие биендээ байрлуулж болно. Жишээлбэл, элемент элемент дотор үүрлэсэн Энэ нь зураг догол мөр дотор байна гэсэн үг. Бид энэ догол мөрөнд бусад элементүүдийг оруулж болно. Жишээ нь, ямар нэг текстийн фрагментийг элементэд хавсаргая. Энэ хэсэг нь налуу үсгээр бичигдсэн байна. Элементүүд нь огтлолцох ёсгүй: хэрэв элемент нь элемент дотор нээгдсэн бол Дараа нь энэ нь бас дотроо хаагдах ёстой Хэрэв бид элементийг эх элементийнх нь "гадна" хаах юм бол энэ нь ноцтой алдаа болох бөгөөд Dreamweaver энэ тухай бидэнд мэдэгдэх болно. Энд бид давхардсан шошготой байна гэж мэдэгдэв. Зарим шошго нь нэрээс гадна тухайн элементийн талаарх нэмэлт мэдээллийг агуулсан шинж чанаруудыг агуулж болно. Атрибут нь атрибутын нэр болон тэнцүү тэмдгээр тусгаарлагдсан утгаас бүрдэнэ. Жишээлбэл, шошго нь зургийн өргөнийг хариуцдаг width шинж чанарыг агуулдаг. Бид энэ шинж чанарын утгыг өөрчлөх боломжтой бөгөөд зургийн өргөн өөрчлөгдөх болно. Тусгай шинж чанарууд нь id ба анги юм. Эдгээр шинж чанарууд нь бараг бүх элементэд хамаарна. Id нь элементэд өвөрмөц нэр өгөх, улмаар түүнийг ижил төстэй хэд хэдэн элементээс ялгах боломжийг олгодог. Дараа нь энэ нэрийг ашиглаж болно: Нэгдүгээрт, тодорхой элементийн стандарт бус дизайны хувьд (жишээлбэл, бид 2 догол мөртэй - ижил элементүүд, тус тусад нь адилхан харагддаг; id шинж чанарыг ашиглан тэдэнд нэр өгөх замаар бид тус тусад нь дизайныг хянах ). Хоёрдугаарт, id-г гипер холбоосын зорилт болгон ашиглаж болно, өөрөөр хэлбэл бид зөвхөн хуудас руу биш, харин түүн дээрх тодорхой байршилтай холбох боломжтой. Гуравдугаарт, програмистын хэрэгцээнд (тодорхой элемент бүхий тодорхой заль мэх хийхэд). Анги нь id-ээс ялгаатай нь өвөрмөц байх албагүй. Энэ нь нэг буюу хэд хэдэн элемент нь тодорхой ангилалд хамаарахыг тодорхойлдог. Ангиудыг голчлон дизайны хэрэгцээнд ашигладаг. Жишээлбэл, бид хэд хэдэн догол мөрийг нэг ангид хамаарах гэж тэмдэглэж болно. Одоо бид нэг ангид хамаарах энэ болон энэ догол мөрүүдтэй бөгөөд одоо бид тэдгээрийн дизайныг нэг цохилтоор өөрчлөх боломжтой. HTML нь шошгуудаас гадна "орлуулалт" (аж ахуйн нэгж) гэж нэрлэгддэг зүйлийг ашигладаг. Эдгээр нь хоёр тохиолдолд шаардлагатай: гар дээр байхгүй тэмдэгтүүдийг баримт бичигт оруулах (жишээлбэл, "зөв" ишлэл) болон HTML хэл дээр үйлчилгээний утгатай тэмдэгтүүдийг оруулах. Жишээлбэл, хэрэв бидэнд өнцгийн хаалт хэрэгтэй бол бид үүнийг кодонд байгаагаар нь бичвэл, мэдээжийн хэрэг, үүнийг хөтөч шошго гэж хүлээн зөвшөөрөх болно. Энэ тохиолдолд өнцгийн хаалтны оронд хөтчөөс өнцгийн хаалт гэж тайлбарлах тусгай орлуулалтыг зааж өгөх хэрэгтэй. Орлуулах нь дараах хэлбэртэй байна: & код; Бид энгийн үед код нь мнемоник, тусгай үг эсвэл тоон байж болно тэмдгийн дугаарыг заана уу. Тоон кодын өмнө хэш тэмдэглэгдсэн байна. Төрөл бүрийн тэмдэгтүүдэд зориулсан маш олон тооны мнемоник кодууд байдаг боловч тоон кодын тусламжтайгаар бид өгөгдсөн фонт дээр байгаа ямар ч тэмдэгтийг, тэр ч байтугай мнемоник кодгүй ч гэсэн зааж өгч болно. Тиймээс элементүүд, хаягууд, шинж чанарууд ба орлуулалтууд нь HTML баримт бичгийг бүтээх үндсэн "барилгын блок" юм. Гэхдээ аливаа барилгын ажилд бид хэд хэдэн үндсэн дүрмийг баримтлах ёстой: эхлээд суурийг тавих, хана барих, байшинг дээвэрлэх гэх мэт. HTML баримт бичгийг бүтээх нь мөн өөрийн гэсэн хуультай бөгөөд тэдгээр нь баримт бичгийн бүтцэд тусгагдсан байдаг. Бид текстийн тэмдэглэгээг их бага хэмжээгээр олж мэдсэн. Та баримт бичгийг таны текст дээр тулгуурлан, шошго ашиглан элементүүдэд хуваасан эсэхийг шалгасан. Гэсэн хэдий ч, та юутай холбоотой нь тодорхойгүй бусад хэд хэдэн элементүүдийг харж болно. Тэдгээр нь хатуу тодорхойлогдсон байдлаар байрладаг. Баримт бичиг нь дараах мөрөөр эхэлнэ: . Энэ бол тунхаглал гэж нэрлэгддэг зүйл юм HTML хувилбарууд. Богинохон боловч үйл явдлаар дүүрэн түүхийн хугацаанд HTML нь хэд хэдэн хувилбараар гарч байсныг та санаж байгаарай. Ингэснээр хөтөч зөв харуулах боломжтой энэ баримт бичиг, тэр аль HTML дээр бичигдсэнийг мэдэх ёстой. Энэ тохиолдолд энэ мөр нь бид HTML хувилбар 4.01-тэй харьцаж байгааг харуулж байна. Мэдэгдэл гарсны дараа баримт бичиг өөрөө эхэлдэг. Энэ нь элементэд хаалттай байна. Бид нээлтийн шошгыг харж байгаа бөгөөд баримт бичгийн төгсгөлд хаалтын шошго байдаг. Элемент дотор шаардлагатай хоёр элемент ар араасаа байрлана: түүний дараа, . , өөрөөр хэлбэл Толгой хэсэг нь хөтчийн цонхонд харагдахгүй үйлчилгээний мэдээллийг агуулдаг, жишээлбэл, элемент нь цонхны гарчигт харагдах баримт бичгийн гарчгийг агуулдаг. - энэ бол баримт бичгийн үндсэн хэсэг - энэ нь манай баримт бичгийн агуулгыг агуулдаг, i.e. хөтчийн цонхонд бидний харж байгаа зүйл. Хэрэв та энэ бүгдийг графикаар дүрсэлсэн бол дараах диаграмм гарч ирнэ. Тодорхойлолтын үүднээс авч үзвэл хамгийн бага HTML баримт бичиг нь HTML хувилбарын мэдэгдэл ба TITLE элемент - баримт бичгийн гарчиг гэсэн хоёр элементийг агуулсан байх ёстой нь сонирхолтой юм. Бусад бүх элементүүд, хатуу хэлэхэд, заавал байх ёстой. Ийм баримт бичгийн мэдээллийн үнэ цэнэ маш эргэлзээтэй байх нь тодорхой. HTML синтакс Энэ нийтлэлд бид HTML синтакс болон HTML кодыг хэрхэн зөв бичих талаар авч үзэх болно. HTML баримт бичгийн бүтэц Notepad дээр HTML код бичихдээ нэг хэв маягийг баримтлахыг зөвлөж байна. Стандарт HTML баримт бичгийн бүтэц дараах байдалтай байна. Хуудасны гарчиг Өгүүллийн гарчиг Нийтлэлийн догол мөр HTML баримт бичиг бүр мөрөөр эхлэх ёстой бөгөөд энэ нь баримт бичигт байгаа кодыг HTML хэлээр бичнэ гэсэн үг юм. Дараа нь HTML код өөрөө ирдэг. Тагуудын хооронд үндсэн хоёр блок байх ба эхний блок нь HTML баримтын толгой бөгөөд энэ нь хаягуудаар эхэлж, төгсгөлүүд, хоёр дахь блок нь HTML баримт бичгийн эх хэсэг бөгөөд тагуудаар төгсдөг. HTML баримт бичгийн толгой нь янз бүрийн мэдээллийг агуулна үйлчилгээний мэдээлэл, хэрэглэгч хардаггүй (гарчгийн шошгыг эс тооцвол) дараах шошготой байна: - HTML хуудасны нэр, — мета шошго, тэдгээр нь хуудасны талаарх үйлчилгээний мэдээллийг агуулсан, — .css, .ico гэх мэт гадаад файлуудад хамаарах шошго, - шошго нь JavaScript код агуулсан эсвэл гадаад .js файлтай холбогдож болно HTML баримт бичгийн үндсэн хэсэг нь ихэвчлэн хуудсан дээрх үндсэн мэдээллийг агуулдаг бөгөөд энэ нь дараах хаягуудыг агуулж болно. - нийтлэлийн гарчиг, нэгдүгээр түвшин, - зураг, - догол мөр, - холбоос, - ширээ, - хэлбэр мэдээлэл оруулах, гэх мэт. HTML код бичих дүрэм HTML код бичих зарим дүрмийг авч үзье. Дараа нь өөрийн кодыг ойлгоход тохиромжтой байхын тулд эдгээр дүрмүүд хэрэгтэй. Бусад шошгуудын дотор байгаа блок шошгыг байрлуулсан шошгоны баруун талд нэг мөр доор, нэг хоосон зай (таны хүссэнээр таб) байрлуулах нь дээр. Жишээ нь, энэ нийтлэлийн эхэнд байрлах HTML баримт бичгийн диаграмм дахь үндсэн шошготой холбоотой h1 гарчиг ба p догол мөр ингэж байршдаг. Нэг элементийн хаах болон нээх таг нь шошго гэх мэт ижил түвшинд байж болно, эсвэл хаалтын таг нь гарчгийн хаалтын таг, h1, p элемент гэх мэт текстийн төгсгөлд байрлаж болно. Өөр хоорондоо ижил төстэй элементүүдийг дээр байрлах HTML баримт бичгийн схемд ижил түвшинд байрлуулж болно, бие биентэйгээ тэнцүү элементүүд нь толгой ба бие, h1 ба p . Үнэн хэрэгтээ бүх HTML кодыг нэг мөрөнд бичиж болох бөгөөд хөтөч HTML хуудсыг зөв харуулах болно. HTML хэлний синтаксийн дүрмүүд нь шошгуудыг бие биенийхээ доор болон зүүн талд бичих шаардлагатай бөгөөд энэ нь зөвхөн вэбмастерт ирээдүйд HTML хуудасны кодыг үүсгэх, өөрчлөхөд илүү хялбар болгох үүднээс л байдаг. Кодоо үүсгэхдээ анхаарах өөр хэдэн зүйлийг энд оруулав. Та хичнээн зай тавьсан ч хамаагүй текст засварлагч, хөтөч тэдгээрийг нэг орон зай болгон харуулах болно. Текст засварлагчийн мөрийн завсарлага, табыг хөтөч таньдаггүй. Хэрэв та HTML хуудсан дээр харагдах ёстой мөрийг боох шаардлагатай бол тагийг ашиглана уу . Хэрэв танд HTML хуудсан дээр харагдах таб хэрэгтэй бол (жишээлбэл, "улаан" мөр үүсгэх) хэд хэдэн тусгай тасрахгүй зай тэмдэгт эсвэл текстийн догол CSS шинж чанарыг ашиглана уу.