Міністерство освіти і науки України
Національний університет «Львівська політехніка»
Лабораторна робота №1-4
з дисципліни: «Веб-технології та веб-дизайн»
Мета роботи: Розробка веб-сайту з допомогою HTML, CSS Javascript.
Тема роботи: Розробка веб-сайту про годинники.
Програма в роботі:
/
/
/
Висновок: на даній лабораторній було створено веб-сайт з допомогою HTML, CSS, Javascript.
Код програми:
Файл Home:
<!DOCTYPE html>
<html class="webkit chrome chrome38 win" lang="en-US">
<head>
<meta charset="UTF-8" />
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="stylesheet" type="text/css" media="all" href="http://clocks.org.ua/wp-content/themes/grey-opaque/style.css" />
<link rel="alternate" type="application/rss+xml" title="clocks.org.ua » Feed" href="http://clocks.org.ua/feed/" />
<link rel="alternate" type="application/rss+xml" title="clocks.org.ua » Comments Feed" href="http://clocks.org.ua/comments/feed/" />
<script type='text/javascript' src='http://clocks.org.ua/wp-includes/js/jquery/jquery.js?ver=1.8.3'></script>
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://clocks.org.ua/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://clocks.org.ua/wp-includes/wlwmanifest.xml" />
<meta name="generator" content="WordPress 3.5.1" />
<meta name="description" content="Гарне використання часу робить час ще більш дорогоцінним." />
<meta name="keywords" content="годинник, Історія годинника, Відомі годинники,Види наручних годинників, Точність годинника, карманные часы,часы электронные, время, часы бренды, часы украина" />
<link rel="canonical" href="http://clocks.org.ua/" />
<link rel="stylesheet" href="http://clocks.org.ua/wp-content/plugins/wp-page-numbers/panther/wp-page-numbers.css" type="text/css" media="screen" /><!--[if lt IE 7]><script type="text/javascript" src="http://bnote.googlecode.com/files/unitpngfix.js"></script><![endif]-->
<!-- Default Background Settings -->
<style type="text/css">body {background-image:url("http://clocks.org.ua/wp-content/themes/grey-opaque/images/backgrounds/background.jpg"); background-color:#474C52;background-attachment:fixed; background-position:center center; background-repeat:repeat;}#access .menu-header ul, div.menu ul {background-image:url("http://clocks.org.ua/wp-content/themes/grey-opaque/images/backgrounds/background.jpg"); background-color:#474C52;background-attachment:fixed; background-position:center center; background-repeat:repeat;}</style>
<!-- /Default Background Settings -->
</head>
<body class="home blog">
<div id="wrapper" class="hfeed">
<div id="header">
<div id="masthead">
<div id="branding" role="banner">
<h1 id="site-title">
<span>
<a href="" title="clocks.org.ua" rel="home">Годинники</a>
</span>
</h1>
<div id="site-description">Гарне використання часу робить час ще більш дорогоцінним.</div>
</div><!-- #branding --><img src="" alt="" /><div id="access" role="navigation"><div class="skip-link screen-reader-text"><a href="#content" title="Skip to content">Skip to content</a></div><div class="menu"><ul><li class="current_page_item"><a href="Home.htm" title="Home">Головна</a></li><li class="page_item page-item-354"><a href="Історія годинника.htm">Історія годинника</a></li> <li class="page_item page-item-436"><a href="Догляд.htm">Догляд</a></li> <li class="page_item page-item-432"><a href="Точність годинника.htm">Точність годинника</a></li></ul></div>
</div> <!-- #access --> </div><!-- #masthead -->
</div><!-- #header -->
<div id="before-content"><p> </p></div>
<div id="main">
<!--1473869321392--> <div id="container" class="one-column">
<div id="content" role="main" >
<div id="post-514" class="post-514 post type-post status-publish format-standard hentry category-uncategorized first-in-loop">
<h2 class="entry-title"><a href="rado.htm" title=" Годинники Rado" rel="bookmark">Годинники Rado</a></h2>
<div id="post-505" class="post-505 post type-post status-publish format-standard hentry category-uncategorized">
<h2 class="entry-title"><a href="jowissa.htm" title=" Історія бренду Jowissa" rel="bookmark">Історія бренду Jowissa</a></h2>
<div id="post-500" class="post-500 post type-post status-publish format-standard hentry category-uncategorized">
<h2 class="entry-title"><a href="adriatica.htm" title=" Годинники Adriatica" rel="bookmark">Годинники Adriatica</a></h2>
<div id="post-492" class="post-492 post type-post status-publish format-standard hentry category-uncategorized">
<h2 class="entry-title"><a href="breitling.htm" title=" Історія бренду Breitling" rel="bookmark">Історія бренду Breitling</a></h2>
<div id="post-480" class="post-480 post type-post status-publish format-standard hentry category-uncategorized">
<h2 class="entry-title"><a href="casio.htm" title=" Історія Casio" rel="bookmark">Історія Casio</a></h2>
<!-- #content -->
</div>
<!-- #container -->
</div><!-- #main -->
<div id="footer" role="contentinfo">
<div id="colophon">
<div id="site-info"></div><!-- #site-info -->
<div id="theme-credits">
<p id="footer-copyright">
<a href=""></a> © 2014 all rights reserved
</p>
</div><!-- #wrapper -->
<script type="text/javascript" src="http://clocks.org.ua/wp-content/themes/grey-opaque/javascript/jquery-smooth-scroll-to-anchor.js"></script><script type="text/javascript" src="http://clocks.org.ua/wp-content/themes/grey-opaque/javascript/jquery-textarea-autoresize.js"></script><script type="text/javascript">
/* <![CDATA[ */
jQuery('textarea#comment').autoResize({
// On resize:
onResize : function() {
jQuery(this).css({opacity:0.8});
},
// After resize:
animateCallback : function() {
jQuery(this).css({opacity:1});
},
// Quite slow animation:
animateDuration : 300,
// More extra space:
extraSpace : 20
}).trigger('change');
/* ]]> */
</script><script type='text/javascript' src='http://clocks.org.ua/wp-content/themes/grey-opaque/plugins/lazy-load/js/jquery.sonar.min.js?ver=1.6.1'></script>
<script type='text/javascript' src='http://clocks.org.ua/wp-content/themes/grey-opaque/plugins/lazy-load/js/lazy-load-min.js?ver=1.6.1'></script>
</body>
<script language="JavaScript">
timestr = "00:00:00";
tid = 0;
pause = 0;
var to;
var bcount;
var tcount;
function writer(){
document.write("test");
}
function time(n) {
tid=window.setTimeout("time(1)",to);
today = new Date()
if(today.getMinutes() < 10){
pad = "0"}
else
pad = "";
if(today.getSeconds() < 10){
pads = "0"}
else
pads = "";
timestr=today.getHours()+":"+pad+today.getMinutes()+":"+pads+today.getSeconds();
document.title = timestr;
window.clearTimeout(tid);
tid=window.setTimeout("time()",to);
}
function start(x) {
f=x;
to=60;
time(x);
}
function cleartids() {
window.clearTimeout(tid);
}
</script>
<body onload="start(document.forms[0])" onunload="cleartids()">
</body>
</html>
Файл Догляд:
<!DOCTYPE html>
<html class="webkit chrome chrome38 win" lang="en-US">
<head>
<script language="JavaScript">
timestr = "00:00:00";
tid = 0;
pause = 0;
var to;
var bcount;
var tcount;
function writer(){
document.write("test");
}
function time(n) {
tid=window.setTimeout("time(1)",to);
today = new Date()
if(today.getMinutes() < 10){
pad = "0"}
else
pad = "";
if(today.getSeconds() < 10){
pads = "0"}
else
pads = "";
timestr=today.getHours()+":"+pad+today.getMinutes()+":"+pads+today.getSeconds();
document.title = timestr;
window.clearTimeout(tid);
tid=window.setTimeout("time()",to);
}
function start(x) {
f=x;
to=60;
time(x);
}
function cleartids() {
window.clearTimeout(tid);
}
</script>
<body onload="start(document.forms[0])" onunload="cleartids()">
</body>
<meta charset="UTF-8" />
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="stylesheet" type="text/css" media="all" href="http://clocks.org.ua/wp-content/themes/grey-opaque/style.css" />
<link rel="alternate" type="application/rss+xml" title="clocks.org.ua » Feed" href="http://clocks.org.ua/feed/" />
<link rel="alternate" type="application/rss+xml" title="clocks.org.ua » Comments Feed" href="http://clocks.org.ua/comments/feed/" />
<script type='text/javascript' src='http://clocks.org.ua/wp-includes/js/jquery/jquery.js?ver=1.8.3'></script>
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://clocks.org.ua/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://clocks.org.ua/wp-includes/wlwmanifest.xml" />
<link rel='prev' title='Точність годинника' href='http://clocks.org.ua/precision-clock/' />
<meta name="generator" content="WordPress 3.5.1" />
<meta name="description" content="Механічні годинники, як і будь-які механізми, вимагають регулярної перевірки, чищення, змащення і регулювання точності ходу." />
<link rel="canonical" href="http://clocks.org.ua/care/" />
<link rel="stylesheet" href="http://clocks.org.ua/wp-content/plugins/wp-page-numbers/panther/wp-page-numbers.css" type="text/css" media="screen" /><!--[if lt IE 7]><script type="text/javascript" src="http://bnote.googlecode.com/files/unitpngfix.js"></script><![endif]-->
<!-- Default Background Settings -->
<style type="text/css">body {background-image:url("http://clocks.org.ua/wp-content/themes/grey-opaque/images/backgrounds/background.jpg"); background-color:#474C52;background-attachment:fixed; background-position:center center; background-repeat:repeat;}#access .menu-header ul, div.menu ul {background-image:url("http://clocks.org.ua/wp-content/themes/grey-opaque/images/backgrounds/background.jpg"); background-color:#474C52;background-attachment:fixed; background-position:center center; background-repeat:repeat;}</style>
<!-- /Default Background Settings -->
</head>
<body class="page page-id-436 page-template-default">
<div id="wrapper" class="hfeed">
<div id="header">
<div id="masthead">
<div id="branding" role="banner">
<div id="site-title">
<span>
<a href="" title="clocks.org.ua" rel="home">Годинники</a>
</span>
</div>
<div id="site-description">Гарне використання часу робить час ще більш дорогоцінним.</div>
</div><!-- #branding --><img src="" alt="" /><div id="access" role="navigation"><div class="skip-link screen-reader-text"><a href="#content" title="Skip to content">Skip to content</a></div><div class="menu"><ul><li ><a href="Home.htm" title="Home">Головна</a></li><li class="page_item page-item-354"><a href="Історія годинника.htm">Історія годинника</a></li> <li class="page_item page-item-436 current_page_item"><a href="Догляд.htm">Догляд</a></li> <li class="page_item page-item-432"><a href="Точність годинника.htm">Точність годинника</a></li></ul></div>
</div> <!-- #access --> </div><!-- #masthead -->
</div><!-- #header -->
<div id="before-content"><p> </p></div>
<div id="main">
<!--1473869321392--> <div id="container" class="one-column">
<div id="content" role="main">
<div id="post-436" class="post-436 page type-page status-publish hentry">
<h1 class="entry-title">Догляд</h1>
<div class="entry-content clearfix">
<p>Для того, щоб Ви отримували задоволення від користування годинником, необхідно слідувати наступним простим правилам:<img class="alignright size-full wp-image-442" title="догляд за годинником" src="http://clocks.org.ua/wp-content/themes/grey-opaque/plugins/lazy-load/images/1x1.trans.gif" data-lazy-src="http://clocks.org.ua/wp-content/uploads/2012/05/brm-trirotor.jpg" alt="догляд за годинником" width="200" height="223" /><noscript><img class="alignright size-full wp-image-442" title="догляд за годинником" src="http://clocks.org.ua/wp-content/uploads/2012/05/brm-trirotor.jpg" alt="догляд за годинником" width="200" height="223" /></noscript></p>
<p><strong>Механічні годинники</strong>, як і будь-які механізми, вимагають регулярної перевірки, чищення, змащення і регулювання точності ходу. Бажано це робити раз на три-чотири роки в авторизованому сервісному центрі, зазначеному в списку, що додається до паспорта годинника. Це є важливою умовою, оскільки при розтині корпусу навіть найдрібніша порошинка, яка потрапила в механізм, може порушити точність ходу годинника внаслідок збільшення тертя. Заводите годинник, тільки знявши їх з руки. Цим виключається нерівномірний тиск на коронку, яка є одним з найбільш уразливих часових компонентів. Годинник з ручним заводом слід заводити в один і той же час, обертаючи заводну коронку за годинниковою стрілкою до упору. Годинники з автоматичним заводом, якщо Ви носите їх щодня, слід заводити раз на тиждень (20-30 обертань заводний коронки за годинниковою стрілкою). У механічних годинниках не рекомендується займатися екстремальними видами спорту, працювати відбійним інструментом і т.д. Сила віддачі, яку приймають на себе годинник, впливають на їх довговічність і точність ходу. Яким би досконалим не був протиударний механізм, завжди існує ймовірність зайвого навантаження, яку деталі механізму можуть не витримати.<br />
У дорогих механічних або ювелірних годинах не варто займатися спортом взагалі. Для цього існують спеціальні спортивні годинник з високим ступенем захисту механізму – міцним масивним корпусом і підвищеної водозахистом.</p>
<p><strong>Кварцові годинники</strong> менш вибагливі щодо догляду за ними, але також вимагають перевірки, чищення й змащення раз на чотири-п’ять років тільки авторизованому сервісному центрі, зазначеному в списку, що додається до паспорта годин.<br />
Для заміни елементів живлення в годинах з кварцовим механізмом, звертайтеся до авторизованого дилера до закінчення терміну дії батареї. Використані батареї можуть потекти і почати корродировать, руйнуючи годинник.<br />
Не намагайтеся змінювати батарейку самостійно. Якщо Ваш годинник водостійкий, то після заміни елемента живлення, годинник повинні пройти тест на водонепроникність і Ви повинні бути впевнені, що волога в них не потрапить.<br />
Щоб не зіпсувати календарний механізм не слід змінювати дату між 22 і 02 годинами ночі. В цей час всі шестерінки починають переміщатися, щоб автоматично перевести дату. Переважно зміну дати слід виробляти, попередньо відвівши годинникову стрілку в нижній сектор циферблата (наприклад, в положення <6:00><img src="http://clocks.org.ua/wp-content/themes/grey-opaque/plugins/lazy-load/images/1x1.trans.gif" data-lazy-src="http://clocks.org.ua/wp-content/themes/grey-opaque/images/smilies/icon_wink.gif" alt="Smilie: ;)" title="Smilie: ;)" /><noscript><img src="http://clocks.org.ua/wp-content/themes/grey-opaque/images/smilies/icon_wink.gif" alt="Smilie: ;)" title="Smilie: ;)" /></noscript>. У більшості швейцарських годинників стояїть сапфірове сткло. Сапфірове скло подряпати досить складно, але є деякі матеріали, які можуть зробити це досить легко. Тому зберігати годинник бажано окремо від прикрас, особливо з дорогоцінними каменями, і в місцях, де вони будуть піддані мінімального тертю про що-небудь. Оптимальним варіантом може бути коробка, в якій продавався годинник. Такі коробки оббиті спеціальним м’яким матеріалом і зроблені спеціально для Вашого годинника.<br />
Замінюйте зламане або тріснуте скло негайно, тому що тріщина товщиною навіть у волосся дозволить порошинка потрапити в механізм, що відіб’ється на точності ходу годинника. Не рекомендується зберігати годинник в холодних приміщеннях. На холоді змащувальні масла густішають, механізм зупиняється, цапфи осей можуть бути пошкоджені. Не слід залишати годинник на кам’яних столиках, наприклад з мармуру, так як сильні зміни температури, яким піддається мармур, можуть викликати пошкодження деяких деталей, особливо пружин і спіралей старих годинників, які робили з нержавіючої сталі. Рекомендується знімати годинник перед сном. Під час сну Ви проводите неконтрольовані рухи, які можуть призвести до пошкодження годин. Крім того, уві сні людина пітніє, і піт, поступово накопичуючись на Ваших годинах, може пошкодити корпус і прокладки, що забезпечують герметичність годин. Якщо Ваш годинник водостійкі, то Ви можете час від часу протирати їх слабким розчином м’якого мила або чистить речовини, після чого годинник необхідно досуха витирати.<br />
Якщо Ваші годинник має шкіряний ремінець, то така процедура повинна проводитися тільки щодо корпусу годинника. У випадку, коли Ваші годинник не водонепроникні або Ви не впевнені в цьому, протирайте їх злегка вологою ганчірочкою, після чого висушуйте сухою. Якщо Ви регулярно займаєтеся спортом або ведете активний фізичний спосіб життя, то Вам треба підбирати собі годинник на металевому браслеті або каучуковому ремінці, замість натурального шкіряного. Пот і піт, що виділяються при занятті спортом, будуть поступово руйнувати натуральну шкіру браслета.<br />
Не рекомендується носити годинник в саунах, лазнях або під гарячим душем. Зайве тепло і волога може пошкодити корпусу годинника і прокладкам герметичності.<br />
Солона морська вода шкодить обробці більшості годин. Тому, навіть водостійкі годинник після морського купання слід промити мильним розчином в теплій проточній воді, щоб уникнути корозії і передчасного старіння прокладок герметичності. Під час контакту з водою заводна коронка і всі наявні кнопки повинні бути у угвинченому положенні.<br />
Необхідно розрізняти<em> водостійкі годинник і водозахисні</em>, тому більшість водостійких годин можуть витримати невелику кількість води протягом короткого проміжку часу. Миття рук або перебування під дощем не пошкодять водостійким годинах, але прийняття душу (особливо з гелем) або довге знаходження під водою приведе до проникнення вологи в корпус і пошкодить механізм.<br />
Для плавання і пірнання розроблені спеціальні водозахисні годинник. Цей годинник зазвичай мають різьбові з’єднання заводної головки і задньої кришки з корпусом. Такі годинники необхідно носити із зафіксованою на різьбленні заводний головкою, щоб вода не потрапила в години і не пошкодила механізм. Не рекомендується сильно загвинчувати заводну головку – можна пошкодити різьблення і прокладку. Герметичність буде повною при закручуванні з легким зусиллям.<br />
Не рекомендується включати свій хронограф (за винятком годин для підводного плавання, де це передбачено) в час, коли його корпус знаходиться у воді. В цьому випадку вода може проникнути всередину корпусу через отвори під кнопками.<br />
Після закінчення 2х-3х років Ваш годинник можуть втратити герметичність через старіння прокладок. Тому необхідно раз на два-три роки перевіряти герметичність і у разі необхідності міняти прокладки. Не рекомендується залишати годинник близько акустичних колонок або інших джерел магнітних полів. Більшість годин не мають магнітного захисту, і при намагнічуванні деталей годинникового механізму, вони можуть почати відставати або, навпаки, йти швидше.
<p class="greyopaque-clear-after-content"></p>
</div><!-- .entry-content clearfix -->
</div><!-- #post-## -->
</div><!-- #content -->
</div><!-- #container -->
</div><!-- #main -->
<div id="footer" role="contentinfo">
<div id="colophon">
<div id="site-info"></div><!-- #site-info -->
<div id="theme-credits">
<p id="footer-copyright">
<a href=""></a> © 2014 all rights reserved
</p>
</div><!-- #wrapper -->
<script type="text/javascript" src="http://clocks.org.ua/wp-content/themes/grey-opaque/javascript/jquery-smooth-scroll-to-anchor.js"></script><script type="text/javascript" src="http://clocks.org.ua/wp-content/themes/grey-opaque/javascript/jquery-textarea-autoresize.js"></script><script type="text/javascript">
/* <![CDATA[ */
jQuery('textarea#comment').autoResize({
// On resize:
onResize : function() {
jQuery(this).css({opacity:0.8});
},
// After resize:
animateCallback : function() {
jQuery(this).css({opacity:1});
},
// Quite slow animation:
animateDuration : 300,
// More extra space:
extraSpace : 20
}).trigger('change');
/* ]]> */
</script><script type='text/javascript' src='http://clocks.org.ua/wp-content/themes/grey-opaque/plugins/lazy-load/js/jquery.sonar.min.js?ver=1.6.1'></script>
<script type='text/javascript' src='http://clocks.org.ua/wp-content/themes/grey-opaque/plugins/lazy-load/js/lazy-load-min.js?ver=1.6.1'></script>
</body>
</html>