Инфоурок Другое ПрезентацииУрок информатики :«Язык разметки гипертекста HTML и его назначение»

Урок информатики :«Язык разметки гипертекста HTML и его назначение»

Скачать материал
Скачать материал "Урок информатики :«Язык разметки гипертекста HTML и его назначение»"

Получите профессию

Технолог-калькулятор общественного питания

за 6 месяцев

Пройти курс

Рабочие листы
к вашим урокам

Скачать

Методические разработки к Вашему уроку:

Получите новую специальность за 2 месяца

Консультант по финансам

Описание презентации по отдельным слайдам:

  • Դասի հեղինակ՝ ԿԱԻ-ի  Արագածոտնի մասնաճյուղի ինֆորմատիկայի մասնագետ  Սիրան Խ...

    1 слайд

    Դասի հեղինակ՝ ԿԱԻ-ի Արագածոտնի մասնաճյուղի ինֆորմատիկայի մասնագետ

    Սիրան Խոյեցյան

  • HTML /Hyper Text Markup Language/ Հիպերտեքստային հղումների լեզու

    2 слайд

    HTML
    /Hyper Text Markup Language/

    Հիպերտեքստային հղումների լեզու

  • Բացել Start→Programs→Accesories →Notepad
Խմբագրել  HTML-նշագրման էջը
Պահպանել...

    3 слайд

    Բացել Start→Programs→Accesories →Notepad
    Խմբագրել HTML-նշագրման էջը
    Պահպանել էջը .html ընդլայնումով
    Web էջերի ստեծում
    HTML փաստաթուղթը տեքստային փաստաթուղթ է *.html ընդլայնումով

  • Օրինակ 1 
   
   
Ողջույն բոլորին
   

HTML էջը կազմված է տեգե...

    4 слайд


    <html>
    <head>
    <title> Օրինակ 1 </title>
    </head>
    <body>
    Ողջույն բոլորին
    </body>
    </html>

    HTML էջը կազմված է տեգերից /անգլերեն Tag/

  • Օրինակ 1 
   
   
Ողջույն բոլորին
   

HTML էջը կազմված է տեգե...

    5 слайд


    <html>
    <head>
    <title> Օրինակ 1 </title>
    </head>
    <body>
    Ողջույն բոլորին
    </body>
    </html>

    HTML էջը կազմված է տեգերից /անգլերեն Tag/

  • HTML-էջերը սկսվում են 
 և վերջանում են տեգերով:

 և  այս նկարագրիչների զույգե...

    6 слайд

    HTML-էջերը սկսվում են
    <html> և վերջանում են </html>տեգերով:

    <head> և </head> այս նկարագրիչների զույգերով ցույց է տալիս
    փաստաթղթային մասի սկիզբը և վերջը:
    <title> </title> այն ինչ գրված կլինի այս տեգերի միջև այն կհանդիսանա բրաուզերով բացված տվյակ փաստաթղթի վերնագիր:

    <body> </body> ցույց են տալիս HTML փաստաթղթի մարմնի սկիզբը և վերջը, որը արտապատկերում է փաստաթղթի պարունակությունը
    Web-էջի կառուցվածքը

  • Այս նկարագրիչները նկարագրում են տառաշարերի մեծության աստիճանը:
 ...  ... 
Այս...

    7 слайд

    Այս նկարագրիչները նկարագրում են տառաշարերի մեծության աստիճանը:
    <h1>...</h1> <h6>...</h6>
    Այս նկարագրիչների միջը տեքստը ընդունվում է որպես մեկ պարբերություն:
    <p>...</p>
    Տեքստի հավասարեցում ըստ...
    <հ1 Align=center>...</h1>
    <հ1 Align=right>...</h1>
    <հ1 Align=left>...</h1>
    Պարբերության հավասարեցում ըստ...
    <p Align=center>...</p>



    Web-էջի կառուցվածքը

  • Структура Web-страницыПусть  файл index.htm, содержит такой HTML-код:...

    8 слайд

    Структура Web-страницы
    Пусть файл index.htm, содержит такой HTML-код:
    <html>
    <head>
    <title> Компьютер </title>
    </head>
    <body>
    Все о компьютере
    </body>
    </html>

    При просмотре в браузере файла,
    получим следующий вид

  • Գունային սխեմա Цвет на Web-странице задают либо его названием, либо числовым...

    9 слайд

    Գունային սխեմա
    Цвет на Web-странице задают либо его названием, либо числовым шестиразрядным шестнадцатеричным кодом #RRGGBB, где две первые цифры задают интенсивность красного цвета (red), средние две цифры – интенсивность зеленого (green), и последние две цифры – интенсивность синего (blue) цветов. Минимальная интенсивность цвета задается 16-ричным числом 00, а максимальная – FF. Легко догадаться, что синий цвет задает “#0000FF”. В таблице приведены значения некоторых цветов:


  • ALIGN=“right” – հավասարեցում  աջից
ALIGN=“center” – հավասարեցում կենտրոնից
A...

    10 слайд


    ALIGN=“right” – հավասարեցում աջից
    ALIGN=“center” – հավասարեցում կենտրոնից
    ALIGN=“left” – հավասարեցում ձախից

    ALIGN, հավասարեցում

  • ԳԼԽԱԳԻՐԻ    ՕՐԻՆԱԿ
  
   
       Համակարգիչ
   
   
Իմ համակարգիչը

    11 слайд

    ԳԼԽԱԳԻՐԻ ՕՐԻՆԱԿ

    <Html>
    <Head>
    <Title> Համակարգիչ</title>
    </head>
    <body>
    Իմ համակարգիչը
    </body>
    </html>

  • թավ , մուգ 
 թեք 
 ընդգծված 
   մուգ  թեք  ընդգծված 
 արտապատկերել  
 ընգծվա...

    12 слайд

    <B> թավ , մուգ </B>
    <I> թեք </I>
    <U> ընդգծված </U>
    <B> <I> <U> մուգ թեք ընդգծված </U></I></B>
    <TT> արտապատկերել </TT>
    <EM> ընգծված </EM>
    <STRONG> ուժեղ ընդգված </STRONG>
    Տեքստի ֆորմատավորում

  • Տեքստի ֆորմատավորում
  
   
       Компьютер 
   
   
 Все о компьютере  
 Жи...

    13 слайд

    Տեքստի ֆորմատավորում

    <Html>
    <Head>
    <Title> Компьютер </title>
    </head>
    <body>
    <H1 ALIGN="center"> Все о компьютере </H1>
    <B> Жирный </B>
    <I> Курсив </I>
    <U> Подчеркнутый </U>
    <B> <I> <U> Жирный подчеркнутый курсив </U></I></B>
    <TT> Равноширинный </TT>
    <EM> Выделение </EM>
    <STRONG> Усиленное выделение </STRONG>
    </body>
    </html>

  • Այս տեգը ունի հետևյալ ատրիբուտները.

FACE – ֆոնտի երես (օրինակ , FACE=“Ari...

    14 слайд

    <FONT> </FONT>
    Այս տեգը ունի հետևյալ ատրիբուտները.

    FACE – ֆոնտի երես (օրինակ , FACE=“Arial”)
    SIZE – ֆոնտի չափը (օրինակ , SIZE=4)
    COLOR – ֆոնտի գունը (օրինակ, COLOR=“blue”)
    Տեքստի ֆորմատավորում

  •   
   
       Компьютер 
   
   

 Все о компьютере  

   
Տեքստի ֆորմատավորում

    15 слайд

    <Html>
    <Head>
    <Title> Компьютер </title>
    </head>
    <body>
    <FONT COLOR="blue">
    <H1 ALIGN="center"> Все о компьютере </H1> </FONT>
    <HR>
    </body>
    </html>
    Տեքստի ֆորմատավորում

  • Պարբերության համարակալումը թվերով և սիմվոլներով 
Մինասյան
Դանիելյան
Սուքիասյա...

    16 слайд

    Պարբերության համարակալումը թվերով և սիմվոլներով
    <ul>
    <li>Մինասյան
    <li>Դանիելյան
    <li>Սուքիասյան
    </ul>

    Մինասյան
    Դանիելյան
    Սուքիասյան




  • Պարբերության համարակալումը թվերով և սիմվոլներով 
Մինասյան
Դանիելյան
Սուքիասյա...

    17 слайд

    Պարբերության համարակալումը թվերով և սիմվոլներով
    <ol>
    <li>Մինասյան
    <li>Դանիելյան
    <li>Սուքիասյան
    </ol>

    Մինասյան
    Դանիելյան
    Սուքիասյան




  • Պարբերության համարակալումը թվերով և սիմվոլներով  այս դեպքում 
համարակալումը ս...

    18 слайд

    Պարբերության համարակալումը թվերով և սիմվոլներով
    <ol start =?> այս դեպքում
    համարակալումը սկսվում է
    ցանկացած թվից:

  • alt տեգը նրա համար է, երբ նկարը չի երեևում, ապա երևում է alt-ում գրված տեքս...

    19 слайд

    <img src = “nkar.gif” width=“605 “ hight=“243” alt=“իմ նկարը”>

    alt տեգը նրա համար է, երբ նկարը չի երեևում, ապա երևում է alt-ում գրված տեքստը:
    Էջում նկար ավելացնել

  • alt տեգը նրա համար է, երբ նկարը չի երեևում, ապա երևում է alt-ում գրված տեքս...

    20 слайд

    <img src = “nkar.gif” widt=“605 hight=243” alt=“իմ նկարը”>

    alt տեգը նրա համար է, երբ նկարը չի երեևում, ապա երևում է alt-ում գրված տեքստը:
    Էջում նկար ավելացնել

  • Հիպերհղումներ HTML –ում անցում որևէ դրվագին  կամ փաստթղթին կատարվում է հետևյա...

    21 слайд

    Հիպերհղումներ
    HTML –ում անցում որևէ դրվագին կամ փաստթղթին կատարվում է հետևյալ նկարագրիչով.

    <a href=“անցումային հասցեն”>
    Օրինակներ՝
    <a href=“http://www.aniedu.am”> Անցում ԿԱԻ կայք</a>
    <a href=“2.html”> անցում տվյալ էջին</a>

  • ԱղյուսակներԱղյուսակը սկսվում է  – տեգով և վերջանում է  
 -ի ատրիբուտները
ALIG...

    22 слайд

    Աղյուսակներ
    Աղյուսակը սկսվում է <TABLE> – տեգով և վերջանում է </TABLE>
    <TABLE> -ի ատրիբուտները
    ALIGN – սա որոշում է աղյուսակի դիրքը էջի
    նկատմամբ:
    ALIGN=“left” հավասարեցում ձախից
    ALIGN=“center” հավասարեցում կենտրոնից
    ALIGN=“right” հավասարեցում աջից
    WITHT- աղյուսակի լայնությունը
    WITHT=400
    BORDER-որոշում է աղյուսակի և բջիջների արտաքին եզրերի հաստությունը պիքսելներով/օր. BORDER=4/


  • CELLSPACING- որոշում է աղյուսակի բջիջների եզրագծերի հեռավորությունը պիքսելներ...

    23 слайд

    CELLSPACING- որոշում է աղյուսակի բջիջների եզրագծերի հեռավորությունը պիքսելներով:
    /օր. CELLSPACING=4/
    CELLPADDING- որոշում է աղյուսակի բջջի եզրագծի հեռավորությունը տեքստից:
    /օր. CELLPADDING=10


  • աղյուսակի ամեն տողը սկսում է այս տեգով և վերջանում է 

ALIGN որոշում է տեքս...

    24 слайд

    <TR> </TR>
    <TR> աղյուսակի ամեն տողը սկսում է այս տեգով և վերջանում է </TR>

    ALIGN որոշում է տեքստի ուղղահայաց ուղղվածությունը բջջում:
    VALIGN=TOP
    VALIGN=MIDDLE
    VALIGN=BOTTOM
    <TD> աղյուսակի ամեն բջիջ սկսում է այս տեգով և վերջանում է </TD>

  • ROWSPANROWSPAN որոշում է տեքստի հորիզոնական ուղղությամբ
Օր.՝   ROWSPAN=2 նշան...

    25 слайд

    ROWSPAN
    ROWSPAN որոշում է տեքստի հորիզոնական ուղղությամբ
    Օր.՝ ROWSPAN=2 նշանակում է, որ բջիջը զբաղեցնում է 2 տող:
    Թույլատրելի արժեքներ են՝.
    ALIGN=LEFT
    ALIGN=CENTER
    ALIGN=RIGHT

  • &lt; COLSPAN &gt; որոշում է բջջի  ուղղահայաց ուղղությամբ .
Օրինակ՝ 
ALIGN    որոշու...

    26 слайд

    <COLSPAN>
    < COLSPAN > որոշում է բջջի <թռիչքը> ուղղահայաց ուղղությամբ .
    Օրինակ՝
    ALIGN որոշում է տեքստի ուղղահայաց
    ուղղվածությունը բջջում:
    VALIGN=TOP
    VALIGN=MIDDLE
    VALIGN=BOTTOM
    <TD> աղյուսակի ամեն բջիջ սկսում է այս տեգով և վերջանում է </TD>

  • HEIGHT որոշում է բջջի բարձրությունը պիքսելներովHEIGHT=40WIGTH  որոշում է բջջի...

    27 слайд

    HEIGHT որոշում է բջջի բարձրությունը պիքսելներով
    HEIGHT=40
    WIGTH որոշում է բջջի լայնությունը պիքսելներով
    HEIGHT=40

  • 28 слайд

  • 29 слайд

  • 30 слайд

  • 31 слайд

Получите профессию

Секретарь-администратор

за 6 месяцев

Пройти курс

Рабочие листы
к вашим урокам

Скачать

Краткое описание документа:

«Язык разметки гипертекста HTML и его назначение»

Тип урока: комбинированный.

Методы:

·         опрос;

·         объяснительно-иллюстративный;

·         частично-поисковый.

Цель урока: Сформировать представление о гипертексте и языке HTML.

Задачи урока:

1. Образовательная:

·         Произвести контроль знаний учащихся по пройденной теме;

·         Дать историческую справку о возникновении термина «гипертекст» и языка HTML;

·         Дать представление о гипертекстах-HTML-документах-Web-страницах.

2. Развивающая:

·         развитие способности к анализу и обобщению;

·         развитие информационной культуры.

3. Воспитательная:

·         развитие познавательного интереса;

·         воспитание информационной культуры.

Оборудование:

·         мультимедийный проектор;

·         экран;

·         презентация «Язык разметки гипертекста HTML и его назначение» (Приложение 1 ppt)

 

 

 

Скачать материал

Найдите материал к любому уроку, указав свой предмет (категорию), класс, учебник и тему:

6 662 192 материала в базе

Скачать материал

Другие материалы

Оставьте свой комментарий

Авторизуйтесь, чтобы задавать вопросы.

  • Скачать материал
    • 23.03.2015 699
    • PPTX 7.4 мбайт
    • Оцените материал:
  • Настоящий материал опубликован пользователем Khoyetsyan Sirush . Инфоурок является информационным посредником и предоставляет пользователям возможность размещать на сайте методические материалы. Всю ответственность за опубликованные материалы, содержащиеся в них сведения, а также за соблюдение авторских прав несут пользователи, загрузившие материал на сайт

    Если Вы считаете, что материал нарушает авторские права либо по каким-то другим причинам должен быть удален с сайта, Вы можете оставить жалобу на материал.

    Удалить материал
  • Автор материала

    Khoyetsyan Sirush
    Khoyetsyan Sirush
    • На сайте: 9 лет и 3 месяца
    • Подписчики: 2
    • Всего просмотров: 18272
    • Всего материалов: 15

Ваша скидка на курсы

40%
Скидка для нового слушателя. Войдите на сайт, чтобы применить скидку к любому курсу
Курсы со скидкой

Курс профессиональной переподготовки

Бухгалтер

Бухгалтер

500/1000 ч.

Подать заявку О курсе
  • Сейчас обучается 22 человека из 16 регионов

Курс повышения квалификации

Специалист в области охраны труда

72/180 ч.

от 1750 руб. от 1050 руб.
Подать заявку О курсе
  • Сейчас обучается 33 человека из 20 регионов
  • Этот курс уже прошли 153 человека

Курс профессиональной переподготовки

Руководство электронной службой архивов, библиотек и информационно-библиотечных центров

Начальник отдела (заведующий отделом) архива

600 ч.

9840 руб. 5600 руб.
Подать заявку О курсе
  • Этот курс уже прошли 25 человек

Курс профессиональной переподготовки

Организация деятельности библиотекаря в профессиональном образовании

Библиотекарь

300/600 ч.

от 7900 руб. от 3650 руб.
Подать заявку О курсе
  • Сейчас обучается 282 человека из 66 регионов
  • Этот курс уже прошли 849 человек

Мини-курс

Создание и продвижение сайтов для достижения максимальных результатов

4 ч.

780 руб. 390 руб.
Подать заявку О курсе
  • Сейчас обучается 31 человек из 15 регионов

Мини-курс

Успешные деловые сделки: от встреч до заключения контракта

4 ч.

780 руб. 390 руб.
Подать заявку О курсе

Мини-курс

Влияние внешних факторов на психологическое развитие личности

4 ч.

780 руб. 390 руб.
Подать заявку О курсе