Главные вкладки

    План-конспект урока по информатике и икт (9 класс) на тему:
    Краткая инструкция по созданию Web-страницы

    Тимофеева Оксана Игоревна

    В своих инструкциях я излагаю основные тэги для создания страницы. Основной материал я, конечно добавляю устно. Но, если учащиеся пропустили урок, они могут воспользоваться этими подсказками.

    Скачать:

    ВложениеРазмер
    Файл tegi_.docx14.42 КБ
    Файл freymy.docx13.04 КБ

    Предварительный просмотр:

    Структура WEB-страницы

    </span><span class="c0">index</span><span class="c4 c0">

    Тело страницы: текст, иллюстрации, гиперссылки, таблицы и т.д.

    Атрибуты тэга BODY:

    Изменение цвета фона:

    <body bgcolor="000000">

    Фон картинкой:

    <body background="имя.расшир" bgproperties="fixed">

    Работа с текстом

    ="4" face="Arial" color="red">текст

    Size – размер шрифта

    Face – начертание (гарнитура)

    Color – цвет

    Заголовки

    ЗАГОЛОВОК  , где n – от 1до 6, чем меньше n, тем крупнее заголовок

    САМЫЙ КРУПНЫЙ ЗАГОЛОВОК

    Вставка иллюстраций:

    <IMG SRC="имя.расш"width="300"height="300" alt="альтернативный текст" align="left"или"right">

    Width – это ширина картинки,

    Height – это её высота,

    alt – текст, который будет появляться вместо картинки,

    Align – обтекание картинки текстом

    Это одиночный тэг, т.е. закрывать его не надо.

    Гиперссылки

    <A href="имя.расш">активный текст

    Имя и расширение – это тот файл, который будет открыт после нажатия на ссылку (активный текст)

    ="имя.расш."><img src="имя.расш.">активный текст

    Это ссылка с картинки, которая вставлена в текст, активный текст можно и не вставлять.

    Цвет ссылок можно изменять в тэге Body<Body vlink="цвет" alink="цвет">

    VLink – цвет неиспользованной ссылки

    Alink – цвет использованной ссылки

    Бегущая строка

     или "slide" или "alternate" direction="left" или "right" bgcolor="цвет" >

    Behavior – вид бегущей строки

    Scroll – ходит по кругу

    Slide – выйдет и остановится

    Alternate -  прыжки

    Direction – направление движения строки

    Bgcolor – фон бегущей строки

    Для перевода строки в начало абзаца используется тэг

    Списки

  • text
  • Чтобы задать вид маркеров

  • - пустой кружок

  • - кружок

  • - квадратик

     Текст с отступом

      text

    Таблицы

    - таблица

    строка

    Можно задать размеры ячеек тэгами Width и Height:

    Чтобы содержимое ячейки находилось в центре ячейки, можно записать тэг

    :



    Предварительный просмотр:

    Фреймы

    Фрейм – это кадр. При помощи фреймов в одном документе можно создавать несколько самостоятельных страничек в одной. Разделить страницу можно по-разному. Мы выбираем  вот такой вид:

                                                                                   

    и для этого создаём документ:

    <html>

    <head>

    <title>indextitle>

    <frameset cols=”150,*”>

    <frameset rows=”150,*”>

    <frame src=”logo.html”>

    <frame src=”menu.html”>

    >

    <frame src=”content.html”>

    frameset>

    head>

    </html>

                       

    Теперь нужно создать все перечисленные документы: Logo, Menu и Content.

    Для того, чтобы линейка прокрутки не мешала в Logo и картинка прижималась к краям, нужно добавить несколько атрибутов в тэг

    <frame src=”logo.html”>  получим в результате:

    <html>

    <head>

    <title>indextitle>

    <frameset cols=”150,*”>

    <frameset rows=”150,*”>

    <frame src=”logo.html” scrolling= “no” marginwidth=”0” marginheight=”0”>

    <frame src=”menu.html”>

    >

    <frame src=”content.html”>

    frameset>

    head>

    </html>

    Документу Content нужно дать имя, для того, чтобы ссылки из меню отображались в окне Content. Вот так:

    <html>

    <head>

    <title>indextitle>

    <frameset cols=”150,*”>

    <frameset rows=”150,*”>

    <frame src=”logo.html” scrolling= “no” marginwidth=”0” marginheight=”0”>

    <frame src=”menu.html”>

    >

    <frame src=”content.html”name= «1»>

    frameset>

    head>

    </html>

     А в документе Menu нужно в ссылках использовать target=  “1 “


    По теме: методические разработки, презентации и конспекты

    Разработка урока "Создание Web-страницы"

    Данный урок проводился в 11 классе. Тема создание web-страницы на тему "Кем быть?". Учащиеся создавали проекты, в которых отражали информацию о выборе профессии....

    Практические задания по созданию web-страниц

    6 заданий с полным описанием действий: 1 - Основные тэги2 - Тэги форматирования3 - Гиперссылки, вставка графики4 - Формат картинки5,6 -  Бегущая строка, формат таблицы, фреймыПубликация в WWWСпис...

    Создание Web-страниц средствами языка HTML

    Методическая разработка к уроку "Создание Web-страниц средствами языка HTML"...

    Разработка урока по информатике: "Создание Web-страницы"

    Цели:Образовательная:приобрести начальные навыки создания простейших Internet-документов;научиться выполнять форматирование созданных Web-страницВоспитательная:     воспитание...

    Урок по теме: "Создание Web-страницы" (с использованием сети Интернет)

    Муниципальное автономное общеобразовательное учреждение«Средняя общеобразовательная школа № 45»Урок по теме: «Создание Web-страницы»Учитель: Рябинина Ольга Ваисовна,первая квалификационная категория...

    Краткая инструкция по созданию базы данных в Access

    Уроки по созданию баз данных, конечно, дают многие учителя в разных классах - и в 8-х, и старше. Я не предлагаю уроков по созданию базы данных, я просто предлагаю краткую инструкцию, которая позв...


     
    - столбецtd>

    Строка делится на ячейки-столбцы, т.е.:

     ИвановИван>

    Петрович

    Это одна строка таблицы

     

    Можно задать цвет фона для ячейки, ряда, таблицы атрибутом bgcolor

    ИвановИванов
     Иванов