Заглавная страница
Избранные статьи
Случайная статья
Познавательные статьи
Новые добавления
Обратная связь

ТОП 10 на сайте

Приготовление дезинфицирующих растворов различной концентрации

Техника нижней прямой подачи мяча.

Франко-прусская война (причины и последствия)

Организация работы процедурного кабинета

Смысловое и механическое запоминание, их место и роль в усвоении знаний

Коммуникативные барьеры и пути их преодоления

Обработка изделий медицинского назначения многократного применения

Образцы текста публицистического стиля

Четыре типа изменения баланса

Задачи с ответами для Всероссийской олимпиады по праву

Мы поможем в написании ваших работ!

ЗНАЕТЕ ЛИ ВЫ?

Влияние общества на человека

Приготовление дезинфицирующих растворов различной концентрации

Практические работы по географии для 6 класса

Организация работы процедурного кабинета

Изменения в неживой природе осенью

Уборка процедурного кабинета

Сольфеджио. Все правила по сольфеджио

Балочные системы. Определение реакций опор и моментов защемления

Главная Избранные Случайная статья Познавательные Новые добавления Обратная связь FAQ

Завдання до лабораторної роботи

⇐ ПредыдущаяСтр 24 из 33Следующая ⇒

Завдання 1.

Розгляньте приклад документа з використанням атрибута style.

<html>

<head>

<title>Untitled Document</title>

</head>

<body>

<td colspan="2" align="center">Список </td>

</tr>

<td

</tr>

<td>Іванов</td>

</tr>

</table>

<cite>Петров</cite>

</div>

My friends<br>

</div>

</body>

</html>

Завдання 2.

Наберіть HTML-документ за допомогою кожного з редакторів, виділіть селектори типу, селектори класу, селектори id. З'ясуйте в чому різниця між використанням селекторів. Визначте область дії селекторів, де й чому не спрацювали аркуші стилів.

<html>

<head>

<title>Untitled Document</title>

<style type="text/css">

h2 {font-size: 16pt; color: #0033FF; font-family: Geneva, Arial}

h2.curs {font-size: 18pt; font-style: italic; font-family: "Courier New", Courier, mono; color: #006699}

h2.normal {font-size: 16pt; font-style: normal; color: #FF0000}

#bgmagenta {background-color: #CC66FF; color: #FFFF00}

#fishka {background-color: #CC99FF; color: #3300FF; font-family: serif; font-size: 20pt; font-style: oblique}

#bgyellow {background-color: #FFFF00; color: #0000FF; font-family: Verdana, Arial}

div {font-family: «serif"; font-size: 15pt; background-color: #99FFFF; color: #000000; font-style: oblique}

</style>

</head>

<h2>Приємно на пари з ранку приходити</h2>

<h2 class="curs"> Приємно бачити добрі очі екзаменатора</h2>

<h2 id="bgmagenta"> Приємно зайти в деканат після сесії</h2>

<p id="bgmagenta"> Приємно не мати "хвостів", <br> бути успішним і <br id="fishka"> упевненим у завтрашньому дні</p>

<h2 class="curs"> Приємно вчасно захищати лабораторні роботи...</h2><br><br>

<div align="center"> Життя світле й безхмарне, коли тобі 20 років і попереду <p class="normal"> море надій, </p> <hr id="bgyellow" size="8">

усе тіло наповнене енергією й готове до <p id="bgmagenta"> здійснень, щастя, любові </p></div>

<h3 class="curs"> Життя повне приємних моментів</h1>

<h3 id="fishka" align="center"> Тільки варто небагато попрацювати</h3>

<h2 id="bgyellow" align="center"> Мрії прогульника</h2>

<h2 class="normal"> Том 2. Повне зібрання студентських снів</h2>

</body>

</html>

Завдання 3.

Наберіть код, поданий нижче. Перевірте його. Змініть стилі, що використовують форматування шрифту й тексту.

<html>

<head>

<title>Untitled Document</title>

<style type="text/css">

.font1 {font: oblique 300 small-caps x-large/150% "Courier New", Courier, mono; color: #0033FF; background: #FFCCCC;}

#font_small {font-family: cursive; font-size: 120%; font-stretch: expanded; font-style: italic; font-weight: 600; color: #00FF00; background-color: #000066; text-align: center}

pre {font-family: fantasy; font-size: x-small; font-stretch: extra-condensed; font-style: inherit; font-weight: bolder; color: #FFFF66; background- color: #333333;}

.fon_text {font: sans-serif 800 150% normal; color: #000099; background- color: #CC9966; letter-spacing: 16pt; word-spacing: 16px; text-indent: 1.25cm; text-align: left; line-height: 2;}

#sub {font-family: serif; font-size: 14pt; letter- spacing: 5pt; vertical-align: sub;}

#sup {font-family: serif; font-size: 14pt; letter-spacing: 5pt; vertical-align: super;}

</style>

</head>

<body>

Деякі рекомендації із суспільного поводження в різних країнах

</div>

Германія

</p>

<pre>

Треба називати титул кожного, з ким розмовляєте. Якщо титул невідомий, то можна звертатися так: "Herr Doctor!".

</pre>

Слово доктор не зарезервоване, як у нас, тільки для медиків, а вживається кожного разу при вказівці спеціальності або професії.

</div>

У ресторані <span id="sub"> привітають </span> усіх, хто знаходиться біля вас, навіть <span id="sup">незнайомих</span>, <br>

<div class="font1">вираженням "Mahlzeit», що означає приблизно "Приємного апетиту"

</div>

</body>

</html>

Завдання 4.

Створіть із запропонованого тексту HTML - документ, у якому будуть використані заголовні стилі з усіма типами селекторів і вбудовані стилі. Оформіть запропонований текст за допомогою аркушів стилів. При створенні документа використовуйте форматування блоків, тексту, шрифтів, списків, кольору й фону.

Февраль 1999

Илла

Они жили на планете Марс, в доме с хрустальными куполами, на берегу высохшего моря, и по утрам можно было видеть, как миссис К ест золотые плоды, растущие из хрустальных стен, или наводит чистоту, рассыпая пригоршнями магнитную пыль, которую горячий ветер уносил вместе с сором. Под вечер, когда древнее море было неподвижно и знойно, и винные деревья во дворе стояли в оцепенении, и старинный марсианский городок вдали весь уходил в себя, и никто не выходил на улицу, мистера К можно было видеть в своей комнате, где он читал металлическую книгу, перебирая пальцами выпуклые иероглифы, точно струны арфы. И книга пела под его рукой…

Мистер и миссис К были еще совсем не старые. У них была чистая, смуглая кожа настоящих марсиан, глаза желтые, как золотые монеты, тихие, мелодичные голоса. Прежде они любили писать картины химическим пламенем, любили плавать в каналах, …до рассвета разговаривать под голубыми светящимися портретами в комнате для бесед.

Теперь они уже не были счастливы.

Рэй Брэдбери

Марсианские хроники

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

Для чого служать аркуші стилів?
У чому полягає різниця між зовнішніми та внутрішніми аркушами стилів?
Назвіть види селекторів і призначення кожного з них.
Які правила записів внутрішніх стилів?
Яка область застосування аркушів стилів?
Якими можуть бути значення властивостей?
Назвіть основні властивості тексту?
Яка властивість відповідає за міжсимвольну відстань?
Яка властивість відповідає за міжрядкову відстань?
Назвіть основні властивості шрифтів?
У яких одиницях задаються значення властивостей?
Назвіть основні властивості кольору?

Лабораторна робота №9
Зовнішні аркуші стилів. Стильові властивості

Мета: опанувати принципи побудови зовнішніх аркушів стилів. Вивчити стильові властивості блоків, списків та інших елементів, їх значення, навчитися використовувати стильові властивості при створенні HTML-документів.

⇐ Предыдущая 19 20 21 22 232425 26 27 28 Следующая ⇒

Читайте также:

Алгоритмические операторы Matlab

Конструирование и порядок расчёта дорожной одежды

Исследования учёных: почему помогают молитвы?

Почему терпят неудачу многие предприниматели?

Последнее изменение этой страницы: 2020-12-09; просмотров: 83; Нарушение авторского права страницы; Мы поможем в написании вашей работы!

infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 3.129.210.17 (0.009 с.)