СОДЕРЖАНИЕ
Введение 3
1 Описание главной страницы 4
2 Описание скриптов 16
3 Описание CSS файла 24
Заключение 29
Список используемой литературы 30
ВВЕДЕНИЕ
Данная работа предназначена для закрепления знаний, полученных на занятиях по дисциплине «Информационные технологии». И представляет собой курсовую работу по разработке сайта с применением всех полученных ранее навыков. Для разработки я выбрала тему «Мир морских свинок», потому что я очень люблю морских свинок это ласковые и добрые животные. Кто однажды поближе познакомился с морской свинкой, сильно привязывается к этому милому животному.
Для написания этой работы будет применяться два языка программирования: JavaScript и HTML. Вся разработка будет происходить в стандартном редакторе «Блокнот».
1 Описание главной страницы
<HTML>
<HEAD>
<TITLE>Мир морских свинок</TITLE>
<STYLE type="text/css">
html,body {
margin:0px;
padding:0px;
}
</STYLE>
<STYLE>
#menu{
width:100%;
margin:0;
padding:0;
}
#menu ul{
list-style:none;
}
#menu li{
list-style:none;
display:block;
float:left;
}
#menu li a{
font-family:sans-serif;
display:block;
float:left;
height:50px;
color:#F4F4F4;
font-size:18px;
font-weight:bold;
background:url(images/menu_left.png) no-repeat left;
line-height:49px;
padding:0 0 0 20px;
text-decoration:none;
}
#menu li a span{
display:block;
float:left;
background:url(images/menu_right.png) no-repeat right;
height:50px;
color:#F4F4F4;
line-height:49px;
padding:0 20px 0 0;
}
#menu li a:hover span{
display:block;
float:left;
background:url(images/menu_left_h.png) no-repeat left;
height:50px;
}
#menu li a:hover span{
display:block;
float:left;
background:url(images/menu_right_h.png) no-repeat right;
color:#000;
height:50px;
}
</STYLE>
<STYLE>
ul {
list-style: none;
margin: 0;
padding: 0;
}
#menu14 {
width: 200px;
margin: 10px;
}
#menu14 li a {
height: 32px;
voice-family: "\"}\"";
voice-family: inherit;
height: 24px;
text-decoration: none;
}
#menu14 li a:link, #menu14 li a:visited {
color: #000;
display: block;
background: url(menu14.gif);
padding: 8px 0 0 10px;
}
#menu14 li a:hover, #menu14 li #current {
color: #8a2be2;
background: url(menu14.gif) 0 -32px;
padding: 8px 0 0 10px;
}
</STYLE>
<STYLE>
#vr{color:#1C1C1C;
text-align:right;
font-size: 25px;
font-family: Comic Sans MS;
font-weight:bold;}
</STYLE>
</HEAD>
<BODY >
<TABLE border=3 cellpadding=7 cellspacing=0>
<TR>
<TD width=100% colspan=3><IMG SRC ="фон копия.jpg" width=100% height=250 ></TD></TR>
<TR>
<TD width=100% bgcolor="6495ED" colspan=3>
<IMG SRC =хома.gif width=80 height=40 align="right">
<div id="menu">
<ul>
<li><a href="index.html"><span>Главная</span></a></li>
<li><a href="регистрация.html"><span>Регистрация</span></a></li>
<li><a href="index12.html"><span>О сайте</span></a></li>
</ul>
</div>
</TD>
</TR>
<TR><TD width="150" height=25 colspan="1" bgcolor="E6E6FA"><b><font face="Monotype Corsiva" color=black size=5><p align="center" ><IMG SRC =мыша2.gif width=250 height=170 align="center" ></p>
<div id="menu14">
<ul>
<li><a href="index1.html"><span>История</span></a></li>
<li><a href="index2.html.html"><span>Физиология</span></a></li>
<li><a href="index3.html"><span>Содержание</span></a></li>
<li><a href="index4.html"><span>Питание</span></a></li>
<li><a href="index5.html"><span>Поведение</span></a></li>
<li><a href="index6.html"><span>Поэзия</span></a></li>
<li><a href="index7.html"><span>Скорая помощь</span></a></li>
<li><a href="index8.html"><span>Фотогаллерея</span></a></li>
</p>
</ul>
</div>
</TD>
<TD colspan="2" rowspan="10" valign="top"background="043.jpg" align=center ><b><font face="Comic Sans MS" color=black size=3><p align="justify">
<IMG SRC =кар2.gif width=400 height=300 align="left">
      Почему именно морские свинки? Собак необходимо регулярно прогуливать, кошек, конечно, выводить на прогулку не нужно, но они своими острыми коготками рвут мягкую мебель, волнистых попугайчиков и канареек не погладишь, да и вообще они не из тех животных, что ласкаются. То же самое можно сказать о черепахах и рыбках. Золотистый и карликовый хомячки — ночные животные и уже потому не очень подходят для детей. К тому же, они, когда их неловко берут, энергично кусаются. Кроме того, в большинстве случаев они живут два, максимум три года. людям, а также не в последнюю очередь в силу обстоятельств, когда человек живет в таких условиях, что содержание кошек или собак вызывает определенные трудности.
Особенностью морской свинки как домочадца является то, что ее без осложнений можно оставлять на целый день одну в квартире и, если должным образом приготовлена пища, морская свинка может оставаться одна без надзора; к тому же, она — дневное животное, а кроме того, позволяет себя гладить и ласкать. Для маленьких детей примерно с пяти лет морская свинка — идеальное домашнее животное, а также для взрослых, которые никогда до этого не держали животных. По многим причинам она рекомендуется как первое животное. Кто однажды поближе познакомился с морской свинкой, сильно привязывается к этому ласковому животному. Это в равной степени относится и к пожилым, одиноким или больным
Морские свинки живут от пяти до восьми лет, а иногда и дольше, если их содержат грамотно. Кроме того, они практически не агрессивны. Например, они кусаются и царапаются гораздо реже кроликов.
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<script>
var i=0,h,m,s;
var hs,ms,ss;
function Tic()
{
t=new Date();
i++;
h=t.getHours();
if(h<10)
{
hs="0"+s;}
else
{hs=h;}
m=t.getMinutes();
if(m<10)
{
ms="0"+m;}
else
{ms=m;}
s=t.getSeconds();
if(s<10)
{
ss="0"+s;}
else
{ss=s;}
vr.innerText=hs+":"+ms+":"+ss+"";
timer=setTimeout("Tic()",1000);
}
</script>
<body onload=Tic()>
<div id=vr>Время</div>
</body>
</TD></TR>
<TR>
<TD height=300 bgcolor="E6E6FA">
<IMG SRC =линия2.gif width=240 height=80 >
<br>
<br>
<CENTER>
<script>
calendar = new Date();
day = calendar.getDay()
document.write("<table width=150 border=2 align=center bgcolor=#6495ED><tr><td><center><font size=4>")
if (day == 0) {
document.write("<font color= #FF0000>Воскресенье</font>")
}
if (day == 1) {
document.write("Понедельник")
}
if (day == 2) {
document.write("Вторник")
}
if (day == 3) {
document.write("Среда")
}
if (day == 4) {
document.write("Четверг")
}
if (day == 5) {
document.write("Пятница")
}
if (day == 6) {
document.write("<font color= #FF0000 >Суббота</font>")
}
document.write("</font></center></td></tr><tr><td><center><font size=5>")
month = calendar.getMonth();
if (month == 0) {
document.write("Январь")
}
if (month == 1) {
document.write("Февраль")
}
if (month == 2) {
document.write("Март")
}
if (month == 3) {
document.write("Апрель")
}
if (month == 4) {
document.write("Май")
}
if (month == 5) {
document.write("Июнь")
}
if (month == 6) {
document.write("Июль")
}
if (month == 7) {
document.write("Август")
}
if (month == 8) {
document.write("Сентябрь")
}
if (month == 9) {
document.write("Октябрь")
}
if (month == 10) {
document.write("Ноябрь")
}
if (month == 11) {
document.write("Декабрь")
}
document.write("</font></center></td></tr><tr><td><center><font size=6>")
date = calendar.getDate();
document.write(date)
document.write("</font></center></td></tr><tr><td><center><font size=4>")
year = calendar.getYear();
if (year < 100) {
document.write("19" + year + "")
}
else if (year > 1999) {
document.write(year)
}
document.write("</font></center></td></tr></table>")
</script>
<br>
<script type="text/javascript">
var h=(new Date()).getHours();
if (h > 23 || h < 7) document.write("Доброй ночи!");
if (h > 6 && h < 12) document.write("С добрым утром!");
if (h > 11 && h < 19) document.write("Добрый день!");
if (h > 18 && h < 24) document. write("Добрый вечер!");
</script>
</CENTER>
</TD>
</TR>
<TR>
<TD width=100% height=25 bgcolor="6495ED" colspan=3>
<B><FONT SIZE=4><CENTER>
<Script Language="JavaScript">
now = new Date()
if (now.getDay() == 0)
document.write("Отдыхайте, завтра рабочий день...")
if (now.getDay() == 1)
document.write("Сегодня понедельник - настраивайтесь на работу")
if (now.getDay() == 2)
document.write("Уже вторник, понедельник к счастью позади!")
if (now.getDay() == 3)
document.write("Половина недели позади - сегодня уже среда")
if (now.getDay() == 4)
document.write("Сегодня четверг, скоро выходные...")
if (now.getDay() == 5)
document.write("Сегодня пятница - последний рабочий день")
if (now.getDay() == 6)
document.write("Сегодня первый день выходных!")
</Script>
</B></FONT>
</TR>
</TABLE>
</BODY>
</HTML>
Рисунок 1- Главная страница