Естен Ербол : HTML5 Тег білімдері - 4

admin 2018-08-18 Қысқаша

Естен Ербол : HTML5 Тег білімдері - 4...

Сайттағы барлық жобалар тегін қолданысқа берілген, жоба авторы Естен Ербол

HTML5 Тег білімдері - 4

<32> <noscript>

Сипаттамасы

Контейнер <noscript>  егер браузер скрипттермен жұмысты аша алмаса немесе қолданушы олардың ашылуын өзі тежеп отырса, өзінің мазмұнын көрсетеді. Басқа кездерде браузер бұл тегті және оның ішіндегісінің бәрін жоққа шығарады.

 

Code:

Esten Tech
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"   
  2.   "http://www.w3.org/TR/html4/strict.dtd">  
  3. <html>  
  4.   <head>  
  5.     <title>Тег NOSCRIPT</title>  
  6.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  7.     <script type="text/javascript">  
  8.       alert("Hello, world!");  
  9.     </script>  
  10.   </head>   
  11. <body>  
  12.    <noscript><p>Ваш браузер не поддерживает скрипты!</p></noscript>   
  13. </body>  
  14. </html>  

 

Мысалға:


Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз

 

 

<33> <nobr>

Сипаттамасы

Тег <nobr> браузерге мәтінді тасымалсыз көрсетуді хабарлап отырады. Егер құжаттың кодында бұл тег жоқ болса, әрі жолдар арасында тасымал бар болса, онда оларды жойып, мәтін браузер терезесінің сол жағына қарай немесе аталық элементке қарай түзетіледі. Браузер жоларалық тасымалды автоматы түрде жасайды. Сонда мәтін терезенің көлеміне қарай түзетіледі. <nobr> тегін қолдану мәтінді тасымалсыз, бір жолдың бойында көрсетуге арналған. Терезені ары-бері айналдырғанда жолдар көлденеңінен көрініс табады. Қолданушыларға мәтінді толық көру үшін көлденеңінен айналдырып, жылжытып көруге тура келеді. Мұндайды көп адам жақтыра бермейді. 

 

Code:

Esten Tech
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"   
  2.   "http://www.w3.org/TR/html4/strict.dtd">  
  3. <html>  
  4.  <head>  
  5.   <title>Тег NOBR</title>  
  6.   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  7.  </head>  
  8.  <body>  
  9.   
  10.   <h1><nobr>Lorem ipsum dolor sit amet,   
  11.      consectetuer adipiscing elit</nobr></h1>  
  12.   
  13.   <p><nobr>Lorem ipsum dolor sit amet, consectetuer adipiscing elit,   
  14.     sed diem nonummy nibh euismod tincidunt ut lacreet dolore   
  15.     magna aliguam erat volutpat.</nobr> Ut wisis enim ad minim veniam,   
  16.     quis nostrud exerci tution ullamcorper suscipit lobortis nisl   
  17.     ut aliquip ex ea commodo consequat.</p>  
  18.   
  19.  </body>  
  20. </html>  

 

Мысалға:


Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз

 

 

<34> <noframes>

Сипаттамасы

<noframes> тегінің мазмұны фреймдерді ашпағанда, оларды түсіндіре алмайтын кезде браузерде айқын көрінеді. Фреймдермен жұмыс істейтін браузерлер толықтай <noframes> тегінің мазмұнын қабылдамайды. Әдетте бұл тегтің ішінде қолданушыны оның браузерлері фреймді қолданбайтынын көрсететін мәтін жүреді. Немесе фреймі жоқ бетке өтуді өтінеді.

 

Code:

Esten Tech
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"  
  2.   "http://www.w3.org/TR/html4/frameset.dtd">  
  3. <html>  
  4.   <head>  
  5.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  6.     <title>Тег NOFRAMES</title>  
  7.   </head>  
  8.   
  9.   <frameset cols="100,*">  
  10.     <frame src="menu.html" name="leftFrame">  
  11.     <frame src="content.html" name="mainFrame">  
  12.   
  13.     <noframes>Ваш браузер не поддерживает фреймы.</noframes>  
  14.   </frameset>  
  15.   
  16. </html>  

 

Мысалға:


Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз

 

 

<35> <object>

Сипаттамасы

Элемент <object>  браузерге нысанды қалай жүктеп, көрсету керектігін хабарлайды. Оларды браузер қайтадан қабылдамайды. Әдетте мұндай нысандар арнаулы модулі бар браузерлерге қосылуды талап етеді. Оларды плагин дейді. Немесе қосымша бағдарламаларды қосады. 

HTML 4 спецификациясы бірінің ішінде бірі сақталған әр түрлі мазмұндағы бірнеше <object> тегін енгізуге рұқсат етеді. Бұл керекті плагин жоқ кезде браузерді түсінетін контентті көрсетуге мүмкіндік тудырады. Мәселен, сыртқы <object> тегі бейнефайлды жүктеді делік, ал арнаулы кодек орнатылмаған жағдайда ішкі <object> тегі бейнелік суретті көрсетеді.  <object> контейнерінің ішіне қосымша ретінде <param> тегін орналастыруға болады. Ол нысанды көрсету үшін қосымша параметрлерді ұсынады.

 

Code:

Esten Tech
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"   
  2.   "http://www.w3.org/TR/html4/strict.dtd">  
  3. <html>  
  4.   <head>  
  5.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  6.     <title>Тег OBJECT</title>  
  7.   </head>  
  8.   <body>   
  9.    <p><object type="application/x-shockwave-flash"   
  10.       data="https://youtu.be/25s9jDoL8uI" width="400" height="300">  
  11.     <param name="quality" value="high">  
  12.     <param name="wmode" value="opaque">  
  13.    </object></p>  
  14.   </body>  
  15. </html>  

 

 

Мысалға:


Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз

 

 

<36> <ol>

 Сипаттамасы

 Тег <ol> нөмірленген тізімді орнатады. Тізімнің әр элементі <li> тегінен басталуы керек. Егер <ol> тегіне стиль кестесі қолданылса, онда <li> элементтері сол қасиеттерді қабылдайды. 

 

Code:

Esten Tech
  1. <!DOCTYPE HTML>  
  2. <html>  
  3.  <head>  
  4.   <meta charset="utf-8">  
  5.   <title>Тег OL</title>  
  6.  </head>  
  7.  <body>  
  8.    
  9.   <ol>  
  10.     <li>Бірінші</li>  
  11.     <li>Екінші</li>  
  12.     <li>Үшінші</li>  
  13.   </ol>  
  14.   
  15.  </body>  
  16. </html>  

 

 

Мысалға:


Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз

 

 

 <37> <optgroup>

Сипаттамасы

Тег <optgroup> - <option> тегтерін бір топқа біріктірген контейнер. <optgroup> тегінің ерекшелігі тізімнің әдеткі элементі ретінде көрініс бермейді, ол қалың қаріппен беріледі, ал осы контейнерге кіретін басқа элементтер тұрғылықты жерінен оңға қарай жылжып кетеді.

 

Code:

Esten Tech
  1. <!DOCTYPE HTML>  
  2. <html>  
  3.  <head>  
  4.   <meta charset="utf-8">  
  5.   <title>Тег OPTGROUP</title>  
  6.  </head>  
  7.  <body>  
  8.   
  9.   <form action="handler.php">  
  10.    <p><select>  
  11.    <optgroup label="Цвет">  
  12.     <option value="c1">Апельсиновый</option>  
  13.     <option value="c2">Лимонный</option>  
  14.     <option value="c3">Персиковый</option>  
  15.    </optgroup>  
  16.    <optgroup label="Тон">  
  17.     <option value="s1">Светлый</option>  
  18.     <option value="s2">Нормальный</option>  
  19.     <option value="s3">Темный</option>  
  20.    </optgroup>  
  21.    </select></p>  
  22.    <p><input type="submit" value="Отправить"></p>  
  23.   </form>  
  24.   
  25.  </body>  
  26. </html>  

 

Мысалға:


Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз

 

 

<38> <option>

Сипаттамасы

Тег <option> - <select> контейнерінің көмегімен жасалатын тізімнің жеке пункттерін анықтап отырады. Тізімнің кеңдігі <option> тегінде берілген ең жалпақ мәтінмен анықталады, стильдердің көмегімен өзгеріп отырады. Егер тізімнің ақпаратын серверге жіберу жоспарланса, онда <select> элементін пішіннің ішіне енгізу талап етіледі. Тізімдегі ақпаратты скриптер арқылы анықтау керек болған кезде де сөйтеді.

 

Code:

Esten Tech
  1. <!DOCTYPE HTML>  
  2. <html>  
  3.  <head>  
  4.   <meta charset="utf-8">  
  5.   <title>Тег OPTION</title>  
  6.  </head>  
  7.  <body>   
  8.   
  9.   <form action="option1.php">  
  10.    <p><select size="3" name="hero">  
  11.     <option disabled>Выберите героя</option>  
  12.     <option value="t1" selected>Чебурашка</option>  
  13.     <option value="t2">Крокодил Гена</option>  
  14.     <option value="t3">Шапокляк</option>  
  15.     <option value="t4">Крыса Лариса</option>  
  16.    </select></p>  
  17.    <p><input type="submit" value="Отправить"></p>  
  18.   </form>  
  19.   
  20.  </body>  
  21. </html>  

 

Мысалға:


Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз

 

 

<39> <output>

Сипаттамасы

Скрипттердің көмегімен ақпарат шығарылған тармақты анықтап отырады. 

 

Code:

Esten Tech
  1. <!DOCTYPE html>  
  2. <html>  
  3.  <head>  
  4.   <meta charset="utf-8">  
  5.   <title>output</title>  
  6.  </head>  
  7.  <body>  
  8.   <form oninput="result.value=(cm.value/2.54).toFixed(2)">  
  9.     <p>Введите длину в сантиметрах:   
  10.     <input type="number" name="cm" autofocus></p>  
  11.     <p>Длина в дюймах: <output name="result">0</output></p>  
  12.   </form>  
  13.  </body>  
  14. </html>  

 

Мысалға:


Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз

 

 

<40> <p>

Сипаттамасы

Мәтіндегі қызыл жолды анықтайды. Тег <p> блоктайтын элемент болып тұр. Ол ылғи жаңа жолдан басталады. Мәтіндегі қызыл жол бірінен кейін бірі тізілетін шегерімдермен бөлінеді. Шегерімнің ұлғайтып-кішірейту үшін стильдерге жүгінуге болады. Егер жабатын тег болмаса, онда қызыл жолдың соңы блоктайтын келесі элементтің басына сай келеді.

 

Code:

Esten Tech
  1. <!DOCTYPE HTML>  
  2. <html>  
  3.  <head>  
  4.   <meta charset="utf-8">  
  5.   <title>Тег P</title>  
  6.  </head>  
  7.  <body>  
  8.   
  9.   <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem   
  10.   nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.</p>  
  11.   <p>Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper   
  12.   suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>  
  13.   
  14.  </body>  
  15. </html>  

 

Мысалға:


Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз

 

 

 Дайындаған: Естен Ербол

Esten TechЕстен Ербол : HTML5 Тег білімдері - 4

Барлық құқықтар қорғалған

Естен Ербол : HTML5 Тег білімдері - 3
Естен Ербол : HTML5 Тег білімдері - 5

Ұқсас тақырыптар