50753

Програмування графіки засобами CSS

Лабораторная работа

Информатика, кибернетика и программирование

Мета: Отримати навички програмування графіки засобами CSS. Обладнання: ПЕОМ IBM PC, текстовий редактор, Internet Explorer.

Украинкский

2014-01-30

200.5 KB

1 чел.

Лабораторна робота11

Тема:  «Програмування графіки засобами CSS»

Мета:  «Отримати навички програмування графіки засобами CSS»

Обладнання: ПЕОМ IBM PC, текстовий редактор, Internet Explorer.


Хід роботи

1. Розглянути роботу прикладів керування фоном документу:

— приклад Lab6_1_1.html , що задає фоновий колір елементу

— приклад Lab6_1_2.html , що задає фонове зображення, що повторюється. Модифі-кувати приклад так,  щоб зображення повторювалося тільки по вертикалі (горизонталі).

— приклад Lab6_1_3.html , що задає фіксоване фонове зображення. Модифікувати приклад так,  щоб зображення прокручувалося разом з документом.

— приклад Lab6_1_4.html , в якому всі властивості фону задані в одному оголошенні.

2. Розглянути роботу прикладів керування оформленням тексту документу:

— приклад Lab6_2_1.html , в якому задається колір тексту

— приклад Lab6_2_2.html , в якому задається колір фону тексту.

— приклад Lab6_2_3.html , в якому регулюється розрідженість тексту .

— приклад Lab6_2_4.html , в якому текст вирівнюється

— приклад Lab6_2_5.html , в якому наведене оформлення тексту

— приклад Lab6_2_6.html , в якому створено відступ для першого рядку абзацу.

— приклад Lab6_2_7.html , в якому здійснюється керування регістром символів.

3. Розглянути роботу прикладів керування оформленням границь.

— приклад Lab6_3_1.html , в якому задаються різні типи границь

— приклад Lab6_3_2.html , в якому задаються різні кольори границь.

— приклад Lab6_3_3.html , в якому задається товщина нижньої границі .

— приклад Lab6_3_4.html , в якому задаються всі властивості верхньої границі в од-ному оголошенні

— приклад Lab6_3_5.html , в якому задається товщина всіх границь

— приклад Lab6_3_6.html , в якому всі властивості границь задаються в одному ого-лошенні.

4. Оформити розклад занять, використовуючи стилі фону, тексту та границь

5. Оформити звіт, у який включити коди модифікованих та розроблених прикладів.

Лістинг розробки:
<html>

<head>

<title>Расписание занятий</title>

<style type="text/css">

table

{border: thin dotted #3caa3c;

background-color: #e4f0d9;}

td

{border: thin dotted #3caa3c;}

h1

{font-size: 25px;}

span.back

{background-color: #3caa3c;

font-size: 20px;}

.line {border-bottom: 3px dotted #3caa3c;

padding-left: 85px;}

</style>

</head>

<body background="121212.jpg">

<table width="1000px" align="center">

<tr>

<td valign="top" width="879px"><center>

<br><h1>Расписание занятий группы 381 на второй семестр</h1></center>

</td>

</tr></table>

<table width="1000px" align="center">

<tr>

<td valign="top" width="200px">

<span class="line"><span class="back">&nbsp;&nbsp;&nbsp;Понедельник&nbsp;&nbsp;&nbsp;</span></span><br><br><br>

1. Компьютерная графика<br><br>

2. Микропроц.системы<br><br>

3. Украинский язык по ПН<br><br>

</td>

<td valign="top" width="200px">

<span class="line"><span class="back">&nbsp;&nbsp;&nbsp;Вторник&nbsp;&nbsp;&nbsp;</span></span><br><br><br>

1. Разработка WEB приложен.<br><br>

2. Осн. констр. ЭВМ / Архитектура ЭВМ<br><br>

3. Компьютерная графика / Микропроцессор. системы<br><br>

</td>

<td valign="top" width="200px">

<span class="line"><span class="back">&nbsp;&nbsp;&nbsp;Среда&nbsp;&nbsp;&nbsp;</span></span><br><br><br>

1. Разработка WEB прилож.<br><br>

2. Микропроц. системы<br><br>

3. Осн. констр. ЭBМ<br><br>

</td>

<td valign="top" width="200px">

<span class="line"><span class="back">&nbsp;&nbsp;&nbsp;Четверг&nbsp;&nbsp;&nbsp;</span></span><br><br><br>

1. Микропроц.системы<br><br>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<i>классный час</i><br><br>

2. Програм. и алгоритм. яз.<br><br>

3. Архитектура ЭВМ<br><br>

</td>

<td valign="top" width="200px">

<span class="line"><span class="back">&nbsp;&nbsp;&nbsp;Пятница&nbsp;&nbsp;&nbsp;</span></span><br><br><br>

1. ФВС<br><br>

2. Английский язык<br><br>

3. Архитектура ЭВМ<br><br>

</td>

</tr></table>

<h3><div align="left" style="padding-left: 180px; color: #000000;">&copy; Егориус Тимановский</h3></div>

</body>

</html>

Контрольні запитання:

  1.  Яке призначення CSS?
  2.  Як встановити рисунок в фоні документу так, щоб він був фіксованим?
  3.  Якими параметрами здійснюється вирівнювання тексту?
  4.  Якими параметрами задаються параметри границь?

Висновок: На цій лабораторній роботі я отримав навички програмування графіки засобами CSS.


 

А также другие работы, которые могут Вас заинтересовать

73537. ВОЗДЕЙСТВИЕ ГАРМОНИЧЕСКОГО КОЛЕБАНИЯ НА ЦЕПЬ С НЕЛИНЕЙНЫМ ЭЛЕМЕНТОМ 371.5 KB
  На этом же рисунке показана форма тока в цепи с нелинейным элементом it. Из-за нелинейности вольт-амперной характеристики формы напряжения и тока оказываются различными. Воздействие гармонического сигнала на нелинейный элемент спектра тока...
73539. Заряд внутри диэлектрика, Теорема Гаусса для вектора напряжённости в диэлектрике 146.5 KB
  Выберем на этой поверхности некоторую площадку, малую настолько, что её можно считать частью плоскости и поле на ней можно считать однородным. Построим цилиндр, проходящий через эту площадку с направляющими параллельно вектору напряжённости внешнего поля.
73540. ЭЛЕКТРИЧЕСКИЕ ФИЛЬТРЫ 168.5 KB
  Фильтры применяются для выделения или подавления определенных колебаний разделения частотных каналов формирования спектра сигналов. По расположению на шкале частот полосы пропускания различают следующие фильтры: а нижних частот...
73541. Параллельный колебательный контур и резонанс токов 193.5 KB
  Параллельный колебательный контур с потерями и векторные диаграммы Комплексная входная проводимость такого контура: комплексные проводимости ветвей с индуктивностью и емкостью соответственно...
73542. Простые колебательные контуры 106 KB
  Цепи в которых возникает явление резонанса называют колебательными контурами или резонансными цепями. изображена схема последовательного контура с реактивными элементами L и С и активным сопротивлением R характеризующим потери в контуре. Комплексное входное сопротивление контура на данной частоте определяется согласно уравнению...
73544. Методы и средства защиты растений от болезней 89.5 KB
  Внесение удобрений в высоких дозах часто приводит к тому что возрастает восприимчивость растений к патогенам. Мероприятия по защите растений от болезней должны основываться на всестороннем изучении самой болезни биологических особенностей патогена и защищаемого растения. Система защиты сельскохозяйственной культуры от болезней включает научно обоснованные приемы обеспечивающие благоприятные условия для развития растений без снижения ими уровня устойчивости подавление возбудителей болезней или ограничение их развития.
73545. Сорняки. Биологические особенности сорняков 46 KB
  Паразитные сорняки это растения утратившие способность к фотосинтезу и питающиеся за счет растенияхозяина. Стеблевые паразитные сорняки присасываются к стеблю растенияхозяина. Корневые паразитные сорняки присасываются к корням растенияхозяина это заразихи подсолнечниковая конопляная капустная.