История развития компьютерных игр

Автор работы: Пользователь скрыл имя, 20 Февраля 2011 в 13:15, курсовая работа

Краткое описание

Технология World Wide Web, в переводе Всемирная паутина получила столь широкое распространение из-за простоты своих пользовательских интерфейсов. Принцип жми на то, что интересно, лежащий в основе гипертекста, интуитивно понятен. В технологиях WWW все ключевые понятия просматриваемого документа: слова, картинки - имеют возможность раскрыться новым документом, развивающим это понятие.

Содержание работы

Введение 2

Теоретическая часть 3

Практическая часть 13

Заключение 23

Список литературы 24

Содержимое работы - 1 файл

курсовая2.doc

— 333.50 Кб (Скачать файл)
y">    ROWSPAN - определяет, сколько строк таблицы ячейка будет перекрывать.
    NOWRAP - если этот параметр указан, содержимое ячеек не будет переноситься, чтобы влезать в ширину ячейки.
    BGCOLOR - параметр, поддерживаемый современными браузерами: указывает цвет фона ячейки в виде RGB-триплета или символьного имени.
    Еще один тег для оформления ячеек  таблиц - тег <TH>...</TH> - нужен для задания заголовочных ячеек. Он во всем совпадает с тегом <TD>, но в отличие от него, содержимое выдается жирным шрифтом и центрируется.
    Если  нужно задать заголовок ВСЕЙ таблицы, используйте тег <CAPTION параметры>...</CAPTION>. Он должен быть внутри тега <TABLE>, но вне описания ячеек. Тег имеет один параметр:
    ALIGN - указывает положение заголовка: он может быть в верхней (TOP) или нижней (BOTTOM) части таблицы.
    Рамки (фреймы)
    Мощным  визуальным средством являются так  называемые рамки или фреймы (frames). С помощью рамок область отображения браузера может быть разделена на отдельные части, содержащие различные документы. При этом возможно задание связей между рамками так, что выбор ссылки в одной рамке может приводить к отображению запрошенного документа в другой. Это позволяет создавать очень удобные в использовании документы (при неправильном применении можно также создать и очень неудобные). Рамки на сегодняшний день поддерживаются в последних версиях таких браузеров, как Netscape Navigator (начиная с версии 2.0) и MS Internet Explorer (версии 3.0 и выше), но популярность применения рамок растет, и похоже, что вскоре к этим браузерам добавятся новые.
    Рамки описываются в специальном HTML-документе, называемом Документом Описания Рамок. Этот документ содержит описание числа, размеров и положения рамок, а также URL-и их содержимого. Нельзя пытаться вписать содержимое рамок в описание, оно должно находиться в отдельных документах.
    При описании рамок тег <BODY> заменяется на тег
     
<FRAMESETпараметры> 
     
описания содержимого рамок
     
... 
</FRAMESET> 
Тег будет игнорироваться браузером, если перед ним встретятся любые теги, в обычном случае встречающиеся внутри тега <BODY>. Теги <FRAMESET> могут быть вложенными, что позволяет, как Читатель увидит далее, создавать очень сложные конструкции. Параметры тега <FRAMESET> могут быть следующими:
    ROWS=``x1,x2,... или x1%,x2%,... или x1*,x2*,...'' - этот параметр описывает рамки как строки различной высоты. Высоты рамок задаются списком разделенных запятыми значений. Высоты измеряются в точках, процентном отношении от общей высоты области отображения, либо как относительные величины. Сумма высот всех рамок должна быть равна высоте всей области отображения. Если этого не происходит, браузеры сами корректируют значения.
    COLS=``x1,x2,... или x1%,x2%,... или *'' - используется для описания рамок как столбцов различной ширины. Используется так же, как параметр ROWS.
    Примеры:
    <FRAMESET ROWS="3*,*">
    задаст  две горизонтальные рамки, причем первая (верхняя) будет в три раза выше второй (нижней).
    <FRAMESET ROWS="100,*,50">
    задаст  три горизонтальные рамки, причем первая (верхняя) будет иметь высоту 100 точек, третья (нижняя) будет иметь высоту 50 точек, а вторая (средняя) займет все оставшееся пространство.
    <FRAMESET COLS="70%,30%">
    задаст  две вертикальные рамки, причем первая (левая) будет иметь ширину 70% общей ширины области отображения, а вторая (правая) -- 30%.
    Для задания содержимого рамки используется тег <FRAME параметры>. Параметры могут быть следующими:
    SRC - указывает URL документа, который должен быть отображен в рамке. Если параметр не указан, рамка останется пустой.
    NAME - значение этого параметра определяет имя для рамки. Впоследствии по этому имени на рамку можно будет сослаться с помощью параметра TARGET тега <A>.
    SCROLLING - показывает, можно ли проматывать содержимое документа в рамке. Может принимать следующие значения:
    YES - содержимое рамки МОЖЕТ проматываться.
    NO - содержимое рамки НЕ может проматываться.
    AUTO - браузер решает, отображать линейку прокрутки или нет (исходя из длины документа). Это значение иcпользуется по умолчанию.
    NORESIZE - если этот параметр указан, пользователь не сможет изменить размеры рамки. По умолчанию пользователь МОЖЕТ изменять размеры отображаемых рамок (например, таская границу рамки указательным устройством).
    MARGINWIPH - указывает на величину горизонтального отступа внутри рамки.
    MARGINHEIGHT - указывает на величину вертикального отступа внутри рамки.
    соответствует примерно следующей раскладке рамок  в области отображения:
    Что же происходит, если браузер не понимает рамок? Пользователь видит абсолютно чистый экран и не может добраться до нужной ему информации. Как сделать так, чтобы такая ситуация не возникала? Разработчики расширений предусмотрели такую ситуацию и придумали тег, содержимое которого никогда не отображается в браузере, понимающем рамки, тогда как ``глупый'' браузер, увидя незнакомый тег, честно отобразит его содержимое без применения каких-либо хитростей. Такой тег называется 
<NOFRAMES> 
Внутри него рекомендуется располагать ссылки на документы, не содержащие рамок.
    Для организации связей между рамками  разработчики предусмотрели параметр TARGET для тега <A>. Он также может применяться в тегах <BASE>, <AREA> и <FORM>.

 

Раздел II

Практическая  часть  

Разработка  сайта посредством  HTML 
 

      Итак, в качестве практической части была выбрана работа по созданию сайта на тему: «Япония» 

Создание графических объектов 

      В первую очередь перед началом  верстки гипертекста нужно продумать  общий дизайн страниц, их количество, структуру, а также создать элементы графической оболочки сайта. Лучше  всего подойдет Adobe Photoshop CS5.  

Кнопки  меню 
 
 

     

    
 
 
 

  или 
(кому как нравится)
 

Для новостной  ленты: 

 
 

Для части  HEAD 

 
 

Макет страницы 

       Также важно продумать макет структуры  сайта. Макет нашего сайта будет  выглядеть примерно так: 
 

 
 

Верстка 

       Теперь  можно приступать к верстке. Делаем главную страницу: 

Главная страница: 

<html>

<head >

<META HTTP-ENQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=WINDOWS-1251">

<META NAME="AUTHOR" CONTENT="Руслан Смоилов">

<meta name="robots" content="all">

<title> Добро  пожаловать в Японию </title>

<center>

<img src="images\77-1024.jpg">

<TABLE width=100% height=3% cellspacing=0><tr><TD BACKGROUND="images\60.jpg">

<MARQUEE DIRECTION=CENTER  SCROLLAMOUNT= align=center><font color=black><B> Новостная строка</b></font></MARQUEE></td></tr></table>

<embed src="2.mp3" hidden=true>

</embed></head> 

<body  background="images\backdrop01.jpg" bgproperties="fixed" leftmargin="35"

rightmargin="35" text="yellow" link="lightgreen" alink="yellow" vlink="lightgreen"> 

<H2>

Добро пожаловать в Японию!</H2>

<TABLE ALIGN=CENTER WIDTH=100% HEIGHT=100% BORDER=0 cellspacing=0 CELLPADDING=16>

<TR HEIGHT=18%>

<TD WIDTH=19% ><br><FORM NAME="FORM1" ACTION="F:\программирование\Курсовая" METHOD="POST">

<INPUT type="text" value="Ваш логин">

<INPUT type="text" value="Ваш пароль">

<INPUT type="SUBMIT" VALUE="Войти"></FORM><a href="2.html"><h3 align=center>Регистрация</h3></a></TD>

<TD></TD>

<TD WIDTH=25% align=right><FORM NAME="FORM2" ACTION="F:\программирование\Курсовая" METHOD="POST">

<INPUT type="text">

<INPUT type="image" src="images\Без имени-2.jpg" width="93" ALIGN=RIGHT></FORM>

</TD>

</TR>

<TR heigh="32%">

<TD  BGCOLOR=BLACK ALIGN=CENTER VALIGN=TOP><BR>

<A HREF="3.HTML"><IMG SRC="images\2.JPG"></A>

<A HREF="4.HTML"><IMG SRC="images\3.JPG"></A>

<A HREF="5.HTML"><IMG SRC="images\4.JPG"></A>

<A HREF="6.HTML"><IMG SRC="images\5.JPG"></A> 

<A HREF="7.HTML"><IMG SRC="images\6.JPG"></A>

<A HREF="8.HTML"><IMG SRC="images\7.JPG"></A>

<A HREF="9.HTML"><IMG SRC="images\8.JPG"></A></TD>

<TD ROWSPAN="2" COLSPAN="2" bgcolor=black valign=top align=justify><h3 align=center> Информация о сайте</h3>

<P align=justify><font size="+1"> &nbsp&nbsp&nbspСайт разработан  с  чисто демонстрационными  целями.

Почему именно <I>Япония</i>? Незнаю.

Может быть потому что Япония является одной из передовых  стран

в области информационных технологий(как впрочем во всем).

<a href="4.HTML#SAPPORO"><IMG SRC="images\800px-Japan_Kyoto_Kinkakuji_DSC00117.jpg" ALIGN=CENTER WIDTH=100%></A>

<br><I>Япония</i> — развитая страна с очень  высоким уровнем жизни 

(десятое место  по индексу развития человеческого потенциала).

В Японии одна из самых высоких ожидаемых продолжительностей жизни,

в 2009 году она  составляла 82,12 года, и один из самых  низких уровней младенческой смертности</font></p></TD>

</TR>

<TR>

<TD bgcolor="black" align=center valign=top>

<br>

<h2>Автомобиль  какой японской марки вы предпочитаете?</h2>

<form>

<Select>

<option value="no">Выберите автобренд

<option value="Toyota">Toyota

<option value="Honda">Honda

<option value="Subaru">Subaru

<option value="Nissan">Nissan

<option value="Mitsubishi">Mitsubishi

</select>

<INPUT TYPE="submit" VALUE="Голосовать">

</form>

<bg><BR><bR> <strong>Итоги опроса:<table width=70% cellspacing=6 height=20% >

<tr><td>Toyota</td><td> 40%</td></tr>

<tr><td>Honda</td><td> 10%</td></tr>

<tr><td>Subaru</td><td> 20%</td></tr>

<tr><td>Nissan</td><td> 10%</td></tr>

<tr><td>Mitsubishi</td><td> 20%</td></tr></TABLE></strong>

</TD></TR></TABLE><br><br><br><br><br>

<A href="http://www.japan.com"> japan.com</a>

<A href="http://www.google">google.com</a>

Информация о работе История развития компьютерных игр