Sunday, April 21, 2019

HTML4 хуудасны бүтэц

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">       <! HTML4, Баримтын зарлалт>
<html>
<head>                                                 <! толгой хэсгийн эхлэл >
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">            <! Encoding зарлалт >
<title> HTML4 </title>                         <! хуудасны гарчиг >
<style>                                     /* дотоод хэлбэрийн CSS эхлэл */
body {                                      /* вэбийн ерөнхий хэлбэр тодорхойлох */
    font-family: Verdana;                       /* үндсэн текстийн фонт */
    font-size: 0.9em;  }              /* үндсэн текстийн хэмжээ */
div#header, div#footer {          /* хуудасны толгой болон хөл хэсгийн хэлбэр тодорхойлох id */
    padding: 10px;                     /* дотор талын зай */
    color: white;                         /* дотор обьектын өнгө */
    background-color: black; }   /* хэсгийн дэвсгэр өнгө */
div#content {                           /* хуудасны мэдээний хэсгийн хэлбэр тодорхойлох id */
    margin: 5px;                         /* гадна талын зай */
    padding: 10px;
    background-color: lightgrey; }
div.article {                              /* хуудасны мэдээ оруулах хэсгийн хэлбэр тодорхойлох класс */
    margin: 5px;
    padding: 10px;
    background-color: white; }
div#menu ul {                          /* хуудасны цэсний хэсгийн хэлбэр тодорхойлох id */
    padding: 0; }
div#menu ul li {                       /* цэсний текстийн хэсгийн хэлбэр тодорхойлох id */
    display: inline;                    
    margin: 5px; }
</style>                                    /* дотоод хэлбэрийн CSS төгсгөл */
</head>                                    /* толгой хэсгийн төгсгөл */
<body>                                    <! их бие хэсгийн эхлэл >
<div id="header">                    <! толгой хэсгийн div таг, header id-тай холбогдсон>
<h1>Mongol News</h1>         <! толгой хэсгийн гарчиг >
</div>                                      <! хэсгийн төгсгөл >
<div id="menu">                      <! цэсний хэсгийн div таг, menu id-тай холбогдсон>
<ul>                                         <! жагсаалт буюу цэсний текст тодорхойлох >
  <li>Мэдээ</li>                      
  <li>Боловсрол</li>
  <li>Нийгэм</li>
</ul>
</div>
<div id="content">                   <! Мэдээний хэсгийн div таг, content id-тай холбогдсон>
<h2>Мэдээний хэсэг</h2>
<div class="article">                <! Мэдээ хэсгийн div таг, article class-тай холбогдсон>
<h2>Мэдээ</h2>
  <p> Hyper Text Markup Language буюу HTML нь вэбийн үндсэн суурь хэл юм. 1990 онд анхны хувилбар гарснаас хойш өдгөө 5 дахь шинэчилсэн хувилбар нь (2008) одоо ч хөгжүүлэгдсээр байна.</p>                                   <! мэдээний текст>
</div>
<div class="article">                <! мэдээлэл хэсгийн div таг, article class-тай холбогдсон>
<h2>Мэдээлэл</h2>
  <p>Hyper Text Markup Language буюу HTML нь вэбийн үндсэн суурь хэл юм. 1990 онд анхны хувилбар гарснаас хойш өдгөө 5 дахь шинэчилсэн хувилбар нь (2008) одоо ч хөгжүүлэгдсээр байна.</p>
</div>
</div>
<div id="footer">                     <! hөлний хэсгийн div таг, footer id-тай холбогдсон>
<p>&copy; 2018 Mongol News</p>    <! хөлний хэсгийн текст >
</div>
</body>                                   <! их биеийн төгсгөл >
</html>

No comments:

Post a Comment