Сайттағы барлық жобалар тегін қолданысқа берілген, жоба авторы Естен Ербол |
HTML5 Тег білімдері - 8
<67> <tr>
Сипаттамасы
Тег <tr> кестенің жолын жасауға арналған контейнер. Мұндай жолдың әрбір ұяшығы <th> немесе <td> тегі арқылы жасалады.
Code:
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
- "http://www.w3.org/TR/html4/strict.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <title>Тег TR</title>
- </head>
- <body>
- <table width="100%" border="0" cellpadding="4">
- <tr align="right" valign="top">
- <td><img src="images/book.png" width="199" height="133" alt="Книга"></td>
- <td>Lorem ipsum dolor sit amet...</td>
- </tr>
- </table>
- </body>
- </html>
Мысалға:
Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз
<72> <tt>
Сипаттамасы
Контейнер <tt> мәтінді моножалпақ мәтінмен береді. Бұл тег жекелей форматтау тег топтарына жатады.
Code:
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
- "http://www.w3.org/TR/html4/strict.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <title>Тег TT</title>
- </head>
- <body>
- <p><tt>Lorem ipsum dolor sit amet</tt></p>
- <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem
- nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.
- Ut wisis enim ad minim veniam, quis nostrud exerci tution.</p>
- </body>
- </html>
Мысалға:
Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз
<73> <u>
Сипаттамасы
Мәтіннің астын сызуды қосады. Бұл тегті HTML жақтырмайды. Оның орнына стильдерді қолданған абзал .
Code:
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
- "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <title>Тег U</title>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- </head>
- <body>
- <p><u>Меню</u></p>
- <p>Пахлава</p>
- <p>Курабье</p>
- <p>Шакер-бура</p>
- </body>
- </html>
Мысалға:
Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз
<74> <ul>
Сипаттамасы
Тег <ul> белгіленген тізімді орнатады. Тізімнің әр элементі <li> тегінен басталуы керек. Егер <ul> тегіне стиль кестесі қолданылса, онда <li> сол қасиеттің бәрін өз бойына сіңіреді.
Code:
- <!DOCTYPE HTML>
- <html>
- <head>
- <meta charset="utf-8">
- <title>Тег UL</title>
- </head>
- <body>
- <ul>
- <li>Чебурашка</li>
- <li>Крокодил Гена</li>
- <li>Шапокляк</li>
- </ul>
- </body>
- </html>
Мысалға:
Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз
<75> <var>
Сипаттамасы
Тег <var> ауыспалы компьютер бағдарламаларын анықтауға қолданылады. Браузерлер мәтінді <var> контейнеріне курсивпен салады.
Code:
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>Тег VAR</title>
- </head>
- <body>
- <p>В данном примере делается запрос к базе данных для получения поля <var>content_title</var>
- из таблицы <var>content</var>, причем должно удовлетворяться условие
- <code>section_id = 1</code>.</p>
- </body>
- </html>
Мысалға:
Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз
<76> <video>
Сипаттамасы
Веб-парақшадағы бейнебаяндардың баптауын басқарып, дыбысталуына, қосуға мүмкіндік тудырады. Файлды ашу үшін src атрибутын немесе енгізілген <source> тегін қолдану керек. Браузерлер аша алатын ауди мен бейнекодектер саны шектеулі, олар бірінші кестеде көрсетілген.
Code:
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>video</title>
- </head>
- <body>
- <video width="400" height="300" controls="controls" poster="video/duel.jpg">
- <source src="video/duel.ogv" type='video/ogg; codecs="theora, vorbis"'>
- <source src="video/duel.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
- <source src="video/duel.webm" type='video/webm; codecs="vp8, vorbis"'>
- Тег video не поддерживается вашим браузером.
- <a href="video/duel.mp4">Скачайте видео</a>.
- </video>
- </body>
- </html>
Мысалға:
Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз
<77> <wbr>
Сипаттамасы
Тег <wbr> браузерге мәтіндегі қай жолдан тасымал жасау керектігін көрсетеді.
Code:
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>Тег WBR</title>
- <style>
- .word { font-size: 2em; }
- wbr { display: inline-block; }
- </style>
- </head>
- <body>
- <p>Самое длинное слово из химии</p>
- <p class="word">метоксихлор<wbr>диэтиламино<wbr>метил<wbr>бутил<wbr>амино<wbr>акридин</p>
- </body>
- </html>
Мысалға:
Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз
<78> <xmp>
Сипаттамасы
Тег <xmp> контейнердің «сол күйінше» мазмұны мен қаріптің шектеген жалпақтығын көрсетеді. <xmp> тегі жабылмайынша, оның ішіндегі барлық тегтер кәдімгі мәтін сияқты көрінеді.
Code:
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>Тег XMP</title>
- </head>
- <body>
- <p>Пример программы</p>
- <xmp>
- while (<>) {
- $org=$_;
- s/\\["']//g;
- s/\/\/[^:].*//;
- s/\/\*.*\*\///g;
- if ($comment == 1) {
- if (s/.*\*\///) {
- $comment = 0;
- }
- else {
- next;
- }
- }
- if (s/\/\*.*//) {
- $comment = 1;
- }
- if (/^\s*#/) {
- next;
- }
- }</xmp>
- </body>
- </html>
Мысалға:
Кодты іске қосуды тұртып Кодтың құбылысын көре аласыз
Дайындаған: Естен Ербол
Esten Tech: Естен Ербол : HTML5 Тег білімдері - 8