SlideShare una empresa de Scribd logo
1 de 15
Html хэлний үндсэн
               ойлголт




Гүйцэтгэсэн:И.Сайнзаяа   LOGO
                                1
HTML хэлний тагтай ажиллах


    1    HTML хэлний ойлголт


    2    HTML-ны үндэс


    3    Head талбар


    4    HTML-ийн үндсэн тагууд




                                  2
Html гэж юу вэ?


 HTML-гэдэг нь Hyper Text Markup
  Language гэсэн үгийн товчлол.
 Энэ хэл нь энгийн текст боловсруулах
  програм ашиглан вэб хуудас үүсгэх
  засварлах мөн бусад програмын
  хэлнүүдийн тусламжтай бүх төрлийн вэб
  хуудас хялбар хийж болно.Үүсгэсэн файл
  нь htm, html гэсэн өргөтгөлтэй.
 HTML файл нь вэб хуудас хийхэд
  зориулагдсан кодчлолыг таг гэнэ.

                                           3
Html-ын үндэс

 <html> эхний кодчлол нь вэб хуудас эхэлж
  байгааг харуулна харина </html> гэж дуусгана.
  <head></head>-хуудасны толгойн хэсгийн
  мэдээллийг агуулна.
 <title>-гарчгийг бичнэ.
 <body>-бичигдсэн мэдээлэл вэб хуудсанд
  харуулагч хэрэгсэлээр харагдана.
 Таг ба кодоо < > хаалтанд бичдэг ба ихэвчлэн
  хосоор бичнэ


                                              4
 Жишээ нь <b> </b> гэх мэт. Үүнийг эхлэлийн
  ба төгсгөлийн код гэж нэрлэдэг.
 <body> кодчлолд дэвсгэр өнгө гэсэн шинжийг
  нэмж болно.<body bgcolor=”green”> гэвэл
  хуудасны дэвсгэр өнгө ногооноор
  гарна.<table>-хүснэгт хүрээгүй болгоё гэвэл
  <table border=”0”>гэж өгнө.
 HTML нь дараах хэсгээс тогтоно.




                                                5
Бичигдэх хэлбэр

<html>
   <head>
        <title>
Энэ хэсэг бичигдсэн текст нь дэлгэсэнд харагдахгүй
        </title>
   </head>
    <body>
Энд бичигдсэн текст харагдана.
    </body>
</html>

                                                     6
Текст таг

 <h1> </h1>-том үсгээр бичих
 <h6> </h6>-жижиг үсгээр бичих
 <h1>-ээс<h6>хүртэл гарчиг бичихэд зориулагдсан
  томоос жижиг үсгийн хэмжээ өөрчлөгдөнө.
 <b> </b>-тодоор бичнэ.
 <i> </i>-Налуу үсгээр бичих.
 <u> </u>-Доогуур зураастай.
 <font size=”?”> </font>-Үсгийн хэмжээ тааруулах.
 <font color=”?”> </font>-үсгийн өнгө англи эсвэл
  кодоор
 <ins> </ins>-бичлэгийн доогуур зураастай бичнэ
                                                     7
 <big> </big>-тодоор ба хэмжээнээс том бичих
 <strike> </strike>-текстийн дундуур нэг зураас татна.
 <pre> </pre>-Дотор бичсэн зүйл яг тэр хэлбэрээр
  гардаг.
 <div align=”left”> </div>-текстийн дэлгэцийн хаана
  байрлахыг заана.
 <small> </smal>-жижиг болгон бичих
 <del> </del>-бичгийн дундуур зураастай бичих.
 <sub> </sub>-мөрний доогуур бичих
 <sup> </sup>-мөрний дээгүүр бичих
 <br>-дараагийн мөр бий болгох
 <p> </p>-шинэ догол мөр бий болгох
                                                          8
Жишээ1.1

1. <html>
2. <head>
3. <title>
4. миний анхны вэб
5. </title>
6.      </head>
7.       <body>
8. манай анхны вэбэд тавтай морил.
9.       </body>
10. </html>


                                     9
гарчиг




Body дотор бичсэн зүйл
      харагдана.




                         10
Дасгал ажил 1.1


1. Манай анхны вэбэд тавтай морил. Гэсэн текстийг
   улаан өнгөөр томоор бич.
2. Манай анхны вэбэд тавтай морил. Гэсэн текстийг
   тодоор доогуур зураастай бич.
3. Манай анхны вэбэд тавтай морил. Гэсэн текстийг
   улаан өнгөөр бич.
4. Манай анхны вэбэд тавтай морил. Гэсэн текстийг
   мөрний доогуур зураастай жижгээр бич.
5. Манай анхны вэбэд тавтай морил. Гэсэн текстийг
   дэлгэцний баруун талд налуу үсгээр бич.

                                                    11
Гэрийн даалгавар

1. Доорх вэб броузер дээр харагдах
   байдлын html кодыг бич!




                                     12
3. Доорх вэб броузер дээр харагдах байдлын html кодыг бич!




                                                             13
3. Доорх кодыг test1.htm хэмээх нэрээр хадгална уу?


<html>
<head>
<title>
миний анхны вэб
</title>
</head>
<body>
<h1>манай анхны вэбэд тавтай морил.</h1>
<br><ins>манай анхны вэбэд тавтай морил.</ins></br>
<br><big>манай анхны вэбэд тавтай морил.</big></br>
<br><sup>манай анхны вэбэд тавтай морил.</sup></br>
<br><del>манай анхны вэбэд тавтай морил.</del></br>
<h6>манай анхны вэбэд тавтай морил.</h6>
</body>
</html>
                                                      14
LOGO
       15

Más contenido relacionado

La actualidad más candente

La actualidad más candente (19)

10 Анги дэвших шалгалт
10 Анги дэвших шалгалт10 Анги дэвших шалгалт
10 Анги дэвших шалгалт
 
вэб дизайн - хичээл 1
вэб дизайн  -  хичээл 1вэб дизайн  -  хичээл 1
вэб дизайн - хичээл 1
 
хүснэгт
хүснэгтхүснэгт
хүснэгт
 
Web design -_lecture_1
Web design -_lecture_1Web design -_lecture_1
Web design -_lecture_1
 
HTML5
HTML5HTML5
HTML5
 
5.1 web
5.1 web5.1 web
5.1 web
 
Lecture 3. css
Lecture 3. cssLecture 3. css
Lecture 3. css
 
web basic 1
web basic 1web basic 1
web basic 1
 
Html гэж юу вэ
Html гэж юу вэHtml гэж юу вэ
Html гэж юу вэ
 
Web design lecture 1
Web design lecture 1Web design lecture 1
Web design lecture 1
 
Web design lecture 2
Web design   lecture 2Web design   lecture 2
Web design lecture 2
 
текст хэлбэржүүлэх
текст хэлбэржүүлэхтекст хэлбэржүүлэх
текст хэлбэржүүлэх
 
Lecture 2. html
Lecture 2. htmlLecture 2. html
Lecture 2. html
 
Web basic 7
Web basic 7Web basic 7
Web basic 7
 
лабораторийн ажил 1
лабораторийн ажил 1лабораторийн ажил 1
лабораторийн ажил 1
 
өөрийн веб сайтыг хийх
өөрийн веб сайтыг хийхөөрийн веб сайтыг хийх
өөрийн веб сайтыг хийх
 
web basic 9
web basic 9web basic 9
web basic 9
 
Lecture_1
Lecture_1Lecture_1
Lecture_1
 
Web basic 5
Web basic 5Web basic 5
Web basic 5
 

Similar a Presentation1

Similar a Presentation1 (9)

Lecture 1
Lecture 1Lecture 1
Lecture 1
 
Web intro (1)
Web intro (1)Web intro (1)
Web intro (1)
 
Web intro
Web introWeb intro
Web intro
 
WEB BASIC 2
WEB BASIC 2WEB BASIC 2
WEB BASIC 2
 
Microsoft power point
Microsoft power pointMicrosoft power point
Microsoft power point
 
Microsoft power point
Microsoft power pointMicrosoft power point
Microsoft power point
 
Microsoft power point
Microsoft power pointMicrosoft power point
Microsoft power point
 
Microsoft power point
Microsoft power pointMicrosoft power point
Microsoft power point
 
Microsoft power point
Microsoft power pointMicrosoft power point
Microsoft power point
 

Presentation1

  • 1. Html хэлний үндсэн ойлголт Гүйцэтгэсэн:И.Сайнзаяа LOGO 1
  • 2. HTML хэлний тагтай ажиллах 1 HTML хэлний ойлголт 2 HTML-ны үндэс 3 Head талбар 4 HTML-ийн үндсэн тагууд 2
  • 3. Html гэж юу вэ?  HTML-гэдэг нь Hyper Text Markup Language гэсэн үгийн товчлол.  Энэ хэл нь энгийн текст боловсруулах програм ашиглан вэб хуудас үүсгэх засварлах мөн бусад програмын хэлнүүдийн тусламжтай бүх төрлийн вэб хуудас хялбар хийж болно.Үүсгэсэн файл нь htm, html гэсэн өргөтгөлтэй.  HTML файл нь вэб хуудас хийхэд зориулагдсан кодчлолыг таг гэнэ. 3
  • 4. Html-ын үндэс  <html> эхний кодчлол нь вэб хуудас эхэлж байгааг харуулна харина </html> гэж дуусгана. <head></head>-хуудасны толгойн хэсгийн мэдээллийг агуулна.  <title>-гарчгийг бичнэ.  <body>-бичигдсэн мэдээлэл вэб хуудсанд харуулагч хэрэгсэлээр харагдана.  Таг ба кодоо < > хаалтанд бичдэг ба ихэвчлэн хосоор бичнэ 4
  • 5.  Жишээ нь <b> </b> гэх мэт. Үүнийг эхлэлийн ба төгсгөлийн код гэж нэрлэдэг.  <body> кодчлолд дэвсгэр өнгө гэсэн шинжийг нэмж болно.<body bgcolor=”green”> гэвэл хуудасны дэвсгэр өнгө ногооноор гарна.<table>-хүснэгт хүрээгүй болгоё гэвэл <table border=”0”>гэж өгнө.  HTML нь дараах хэсгээс тогтоно. 5
  • 6. Бичигдэх хэлбэр <html> <head> <title> Энэ хэсэг бичигдсэн текст нь дэлгэсэнд харагдахгүй </title> </head> <body> Энд бичигдсэн текст харагдана. </body> </html> 6
  • 7. Текст таг  <h1> </h1>-том үсгээр бичих  <h6> </h6>-жижиг үсгээр бичих  <h1>-ээс<h6>хүртэл гарчиг бичихэд зориулагдсан томоос жижиг үсгийн хэмжээ өөрчлөгдөнө.  <b> </b>-тодоор бичнэ.  <i> </i>-Налуу үсгээр бичих.  <u> </u>-Доогуур зураастай.  <font size=”?”> </font>-Үсгийн хэмжээ тааруулах.  <font color=”?”> </font>-үсгийн өнгө англи эсвэл кодоор  <ins> </ins>-бичлэгийн доогуур зураастай бичнэ 7
  • 8.  <big> </big>-тодоор ба хэмжээнээс том бичих  <strike> </strike>-текстийн дундуур нэг зураас татна.  <pre> </pre>-Дотор бичсэн зүйл яг тэр хэлбэрээр гардаг.  <div align=”left”> </div>-текстийн дэлгэцийн хаана байрлахыг заана.  <small> </smal>-жижиг болгон бичих  <del> </del>-бичгийн дундуур зураастай бичих.  <sub> </sub>-мөрний доогуур бичих  <sup> </sup>-мөрний дээгүүр бичих  <br>-дараагийн мөр бий болгох  <p> </p>-шинэ догол мөр бий болгох 8
  • 9. Жишээ1.1 1. <html> 2. <head> 3. <title> 4. миний анхны вэб 5. </title> 6. </head> 7. <body> 8. манай анхны вэбэд тавтай морил. 9. </body> 10. </html> 9
  • 10. гарчиг Body дотор бичсэн зүйл харагдана. 10
  • 11. Дасгал ажил 1.1 1. Манай анхны вэбэд тавтай морил. Гэсэн текстийг улаан өнгөөр томоор бич. 2. Манай анхны вэбэд тавтай морил. Гэсэн текстийг тодоор доогуур зураастай бич. 3. Манай анхны вэбэд тавтай морил. Гэсэн текстийг улаан өнгөөр бич. 4. Манай анхны вэбэд тавтай морил. Гэсэн текстийг мөрний доогуур зураастай жижгээр бич. 5. Манай анхны вэбэд тавтай морил. Гэсэн текстийг дэлгэцний баруун талд налуу үсгээр бич. 11
  • 12. Гэрийн даалгавар 1. Доорх вэб броузер дээр харагдах байдлын html кодыг бич! 12
  • 13. 3. Доорх вэб броузер дээр харагдах байдлын html кодыг бич! 13
  • 14. 3. Доорх кодыг test1.htm хэмээх нэрээр хадгална уу? <html> <head> <title> миний анхны вэб </title> </head> <body> <h1>манай анхны вэбэд тавтай морил.</h1> <br><ins>манай анхны вэбэд тавтай морил.</ins></br> <br><big>манай анхны вэбэд тавтай морил.</big></br> <br><sup>манай анхны вэбэд тавтай морил.</sup></br> <br><del>манай анхны вэбэд тавтай морил.</del></br> <h6>манай анхны вэбэд тавтай морил.</h6> </body> </html> 14
  • 15. LOGO 15