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

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

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

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

 

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

<41> <param>

Сипаттамасы

Тег <param> - <applet> немесе <object> тегтерінің көмегімен жасалған Java-апплеттердің немесе веб-парақшаның параметр мағынасын беруге бағытталған. Мұндай әрекет HTML-құжаттың кодында апплеттің мінездемесін ешбір қосымша компиляциясыз өзгертуге мүмкіндік береді. <param> тегін бір мезетте бірнеше рет қолдануға тек бір мүмкіндік бар. Ол үшін name және value атрибуты арқылы «аты/мағынасы» деген жұпты енгізесіз. 

Апплет деген браузер не оны басқарып отыратын арнаулы бағдарлама құрамында орындалатын бағдарлама. Апплет әдетте Java тілінде жазылады. Сондықтан «Java-апплет» деген теңеу жиі көзге түсуі мүмкін. 

 

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>Тег PARAM</title>  
  7.   </head>  
  8.   <body>    
  9.    
  10.    <p><object classid="animation.class" width="500" height="200">  
  11.     <param name="bgcolor" value="#000000">  
  12.     <param name="delay" value="1000">  
  13.     <param name="loop" value="5">  
  14.    </object></p>  
  15.   
  16.   </body>  
  17. </html>  

 

Мысалға:


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

 

 

<42> <plaintext>

Сипаттамасы

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

 

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>Тег PLAINTEXT</title>  
  7.  </head>  
  8.  <body>  
  9.   <p>Пример программы</p>  
  10.   <plaintext>  
  11.    <h1>Демонстрация метода Подборского</h1>  
  12.    while (<>) {  
  13.      $org=$_;  
  14.      s/\\["']//g;  
  15.      s/\/\/[^:].*//;  
  16.      s/\/\*.*\*\///g;  
  17.      if ($comment == 1) {  
  18.        if (s/.*\*\///) {  
  19.          $comment = 0;  
  20.        }  
  21.        else {  
  22.          next;  
  23.        }  
  24.      }  
  25.      if (s/\/\*.*//) {  
  26.        $comment = 1;  
  27.      }  
  28.      if (/^\s*#/) {  
  29.        next;  
  30.      }  
  31.    }</plaintext>  
  32.  </body>  
  33. </html>  

 

Мысалға:


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

 

 

<43> <pre>

Сипаттамасы

Элемент <pre> алдын ала форматталған мәтіннің блогын айқындайды. Әдетте мұндай мәтін моножалпақ қаріппен теріледі, сөз арасындағы аралықты сақтайды. Қосылмай тұрған кезде кодта қатар келетін бос аралықтың бәрі веб-парақшада біреу ғана боп көрінеді. Тег <pre> осы ерекшелікті айналып өтуге икем береді. Ол мәтінді жасап жатқан адамға сай етіп көрсетеді. HTML 4 мінелетін <plaintext> тегінен бір айырмасы - <pre> контейнерінде мыналардан басқа тегтерді қолдануға рұқсат етілген: <big>, <img>, <object>, <small>, <sub>, <sup>.

 

Code:

Esten Tech
  1. <!DOCTYPE HTML>  
  2. <html>  
  3.  <head>  
  4.   <meta charset="utf-8">  
  5.   <title>Тег PRE</title>  
  6.  </head>  
  7.  <body>  
  8.   <pre>  
  9.      -                -----    
  10.      -----           |-----  
  11.     ||----|          ----||    
  12.     ||-----         -----||    
  13.     ||-----|       |-----||  
  14.     || -----       ------||  
  15.     ||- ----|     |------||  
  16.     ||---||--     -------||  
  17.     ||--|| --|   |-------||  
  18.     || -|| |--   --- - --||  
  19.     || -||  --|-|--| - ---|  
  20.     |---||  |-----| |-----|  
  21.     |---||   |----  |-----|   
  22.     |----|    ---   |-----|  
  23.     |-----          ------|   
  24.  </pre>  
  25. </body>  
  26. </html>  

 

Мысалға:


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

 

 

 <44> <progress>

Сипаттамасы

Мақсатқа жеткен прогрессті сипаттау үшін қолданылады. Мағынасының өзгеруі JavaScript арқылы өтеді.

 

Code:

Esten Tech
  1. <!DOCTYPE html>  
  2. <html>  
  3.  <head>  
  4.   <meta charset="utf-8">  
  5.   <title>progress</title>  
  6.  </head>   
  7.  <body>  
  8.   <p>Сәл күтіңіз, орындалу басқышында. . .   </p>  
  9.   <progress max="100" value="25">  
  10.     Загружено на <span id="value">25</span>%  
  11.   </progress>  
  12.  </body>  
  13. </html>  

 

Мысалға:


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

 

 

 <45> <q>

Сипаттамасы

Тег <q> мәтінде цитаталарды бөліп қарастырады. Контейнердің мазмұны автоматы түрде браузерлерде тырнақшамен көрсетіледі.

 

Code:

Esten Tech
  1. <!DOCTYPE HTML>  
  2. <html>  
  3.  <head>  
  4.   <meta charset="utf-8">  
  5.   <title>Тег Q</title>  
  6.   <style>  
  7.    q {  
  8.     font-family: Times, serif; /* Шрифт с засечками */   
  9.     font-style: italic; /* Курсивное начертание текста */  
  10.     color: #008; /* Цвет текста */  
  11.    }  
  12.   </style>  
  13.  </head>  
  14.  <body>  
  15.   
  16.   <p>Станислав Лец утверждал: <q>Чаще всего выход там, где был   
  17.     вход</q>.</p>  
  18.   
  19.  </body>  
  20. </html>  

 

Мысалға:


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

 

 

<46> <rp>

Сипаттамасы

<ruby> тегін қолдамайтын браузерде мәтінді бөліп қарастыруға арналған. Басқа браузерлерде <rp> контейнеріне салынған мәтін көрінбейді. <rp> тегі <rt> тегінің не алдында, не соңында жүруі тиіс.

 

Code:

Esten Tech
  1. <!DOCTYPE html>  
  2. <html>  
  3.  <head>  
  4.   <meta charset="utf-8">  
  5.   <title>rp</title>  
  6.  </head>   
  7.  <body>  
  8.   <p>  
  9.    <ruby>  
  10.     字 <rp>(</rp><rt></rt><rp>)</rp>  
  11.    </ruby>  
  12.   </p>  
  13.  </body>  
  14. </html>  

 

Мысалға:


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

 

 

 <47> <rt>

Сипаттамасы

Тег <rt> аннотацияны <ruby> контейнеріне бекітіп, не мәтіннің үстіне, не астына қосады. Аннотацияның өзі кішірейтіліп көрсетіледі. 

Мұндай жазба тәсілі көбіне азиаттық тілдерге қатысты жасалады. Қытай не жапон тіліне. Алайда егер бір мәтінді екіншісінің үстіне жазу керек болса, онда өзге тілдерге де қолданыла алады.

 

Code:

Esten Tech
  1. <!DOCTYPE html>  
  2. <html>  
  3.  <head>  
  4.   <meta charset="utf-8">  
  5.   <title>rt</title>  
  6.   <style>  
  7.    .date { font-size: 1.5em; }  
  8.    .date ruby { background: #0078c9; color: #fff; }  
  9.    .date rt { background: #a0dae8; color: #000; padding: 2px; }  
  10.   </style>  
  11.  </head>   
  12.  <body>  
  13.   <p class="date">  
  14.    <ruby>  
  15.     23<rt>ноябрь</rt></ruby>  
  16.   </p>  
  17.  </body>  
  18. </html>  

 

 

 Мысалға:


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

 

 

 <48> <ruby>

Сипаттамасы

Тег <ruby> берілген мәтіннің үстіне не астына аздаған аннотация қосуға арналған. Мұндай жазу пішіні қытай тілі сияқты идеографикалық хаттар жазуға қолданылады. Егер бір мәтіннің үстіне екіншісін жазу керек болса, осындай тәсілді қолданады. 

<ruby> тегі <rt> тегінің контейнері болып шығады. Ол мәтінге арналған аннотацияны қалыптастырады. Содан кейін барып <ruby> тегін ұстамайтын браузерлерге арналған <rp> тегі жүреді. 

Тегтің атау «рубин» сөзінен шыққан, баспаханада бұл кішігірім қаріп деген мағынаны береді. 

 

Code:

Esten Tech
  1. <!DOCTYPE html>  
  2. <html>  
  3.  <head>  
  4.   <meta charset="utf-8">  
  5.   <title>ruby</title>  
  6.   <style>  
  7.    p:lang(zh-CN) {  
  8.     font-size: 2em;  
  9.    }  
  10.   </style>  
  11.  </head>   
  12.  <body>  
  13.   <p lang="zh-CN">  
  14.    <ruby>  
  15.     汉<rt>hàn</rt>  
  16.     字<rt></rt>  
  17.    </ruby>  
  18.   </p>  
  19.  </body>  
  20. </html>  

 

Мысалға:


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

 

 

 

 <49> <s>

Сипаттамасы

Тег <s> мәтінді сызып тастағандай етіп көрсетеді. Бұл тег <strike> тегінің баламасы. Бірақ одан өзгешелігі жазбаның кішкентай пішінін сақтайды. Ондайды <b>, <i> және <u> секілді. Бұл тегтің орнына стильдерді қолдануға болады.

 

Code:

Esten Tech
  1. <!DOCTYPE html>  
  2. <html>  
  3.  <head>  
  4.   <title>Тег S</title>  
  5.   <meta charset="utf-8">  
  6.  </head>  
  7.  <body>  
  8.   
  9.   <p><b>Список должников</b></p>  
  10.   <p><s>Чебурашка</s></p>  
  11.   <p><s>Крокодил Гена</s></p>  
  12.   <p>Шапокляк</p>  
  13.   
  14.  </body>  
  15. </html>  

 

Мысалға:


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

 

 

<50> <samp>

Сипаттамасы

Элемент <samp> компьютерлік бағдарлама не скрипт шығарған нәтиже ретінде көрініс беретін мәтінді көрсету. Браузерлер әдетте мәтінді <samp> контейнерінде моножалпақ қаріппен тереді. Стильдің көмегімен өздігінше безендіруге болады. 

 

Code:

Esten Tech
  1. <!DOCTYPE html>  
  2. <html>  
  3.  <head>  
  4.   <meta charset="utf-8">  
  5.   <title>Тег SAMP</title>    
  6.   <style>  
  7.    code {  
  8.     color: green; /* Цвет текста */  
  9.    }  
  10.    samp {  
  11.     color: maroon; /* Цвет текста */  
  12.    }  
  13.   </style>  
  14.  </head>  
  15.  <body>  
  16.   
  17.   <p>Проверка, поддерживает браузер JavaScript 1.3 или нет.</p>  
  18.   <p><code>   
  19.    <script language="JavaScript1.3"> JS13 = 1;   
  20.     </script><Br>  
  21.    <script language="JavaScript"><Br>  
  22.    if (window.JS13) document.write("Ваш браузер поддерживает JavaScript   
  23.    1.3");<Br>  
  24.    </script>  
  25.   </code></p>  
  26.   <p>В результате выполнения скрипта вы увидите текст <samp>Ваш   
  27.     браузер поддерживает JavaScript 1.3</samp>, в том случае, если браузер   
  28.     работает с версией 1.3.</p>  
  29.   
  30.  </body>  
  31. </html>  

 

Мысалға:


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

 

 

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

 

Жарнама орны

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

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

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

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