Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
lab1.docx
Скачиваний:
4
Добавлен:
07.11.2018
Размер:
846.63 Кб
Скачать

Листинг 4. Листинг Text.Htm

StudBilet.htm

Рис. 5. Скриншот StudBilet.htm

Данный документ выполнен по стандарту HTML 5 и без применения таблиц.

<html>

<head>

<title>Студенческий</title>

<META http-equiv="Content-Type" content="text/html; charset=utf-8">

<style type="text/css">

body {

background-color: #ffffff;

}

.title {

border-bottom: 1px #000 solid;

color: #00f;

position: relative;

width: 400px;

text-align: center;

}

.st {

font-weight: bold;

font-size: 16px;

text-align: center;

margin-left: -120px;

}

.num {

border-bottom: 1px #000 solid;

font-style: italic;

font-weight: normal;

}

.name {

margin-left: 120px;

font-size: 14px;

}

.photo {

position: relative;

float: left;

}

</style>

</head>

<body>

<div style="width: 500px">

<p class="title">

Московский государственный

</p>

<p class="title">

институт радиотехники

</p>

<p class="title">

электроники и автоматики

</p>

<p class="st">Студенческий билет №<span class="num">061220</span></p>

<div class="photo"><img src="photo.jpg" width=150 height=200></div>

<p class="name">Фамилия <span class="num">Соловьёв</span></p>

<p class="name">Имя <span class="num">Алексей</span></p>

<p class="name">Отчество <span class="num">Николаевич</span></p>

<p class="name">Факультет <span class="num">ИТ</span></p>

<p class="name">Дата выдачи билета <span class="num">28.08.2006</span></p>

</div>

</body>

</html>

Листинг 5. Листинг StudBilet.Htm

ZachKnizhka.htm

Рис. 6. Скриншот ZachKnizhka.htm

<HTML>

<HEAD>

<TITLE> МОЯ ЗАЧЕТНАЯ КНИЖКА </title></head>

<META http-equiv="Content-Type" content="text/html; charset=utf-8">

<style type="text/css">

.title {

border-bottom: 1px #000 solid;

color: #00f;

position: relative;

width: 400px;

text-align: center;

}

</style>

<BODY>

<A href="A:\ЛабРаб1_2.htm">Возврат</a>

<A name="top"></a>

<CENTER>

<FONT size=14 color="Red"> <U><B>МОЯ ЗАЧЕТНАЯ КНИЖКА</b></u></font>

</center>

<HR color="silver" SIZE=15 ALIGN=left>

<p class="title">Московский государственный</p>

<p class="title">институт радиотехники</p>

<p class="title">электроники и автоматики</p>

<table>

<tr><td><B>Фамилия, имя, отчество</b></td><td>Соловьёв Алексей Николаевич</td></tr>

<tr><td><B>Факультет</b></td><td> ИТ</td></tr>

<tr><td><B>Специальность</b></td><td>230201</td></tr>

<tr><td colspan=2><B>Поступил</b>________,<B>переведен</b>_____ <B>на</b>1<B>курс из</b>_____</td></tr>

<tr><td colspan=2>пр.№1253 от 12.08.2006</td></tr>

<tr><td><B>Проректор по учебной и научной работе</b></td><td>_________</td></tr>

<tr><td><B>Декан факультета</b></td><td>__________</td></tr>

<tr><td><B>Дата выдачи зачетной книжки</b></td><td> __<u>28.08.2006</u>__.</td></tr>

</table>

</body>

</HTML>

Листинг 6. Листинг ZachKnizhka.Htm

Style.htm

Рис. 7. Скриншот Style.htm

<HTML>

<HEAD>

<TITLE>Использование стилей</title>

<META http-equiv="Content-Type" content="text/html; charset=utf-8">

<META http-equiv="Content-Style-Type" content="text/css">

<STYLE type="text/css">

H1 {border-width: 16; border: groove; text-align: center; color: #4142e9}

H2 {color: #864cd5; font-style: italic}

CODE {font-family: Tahoma, Helvetica; background-color: #f9cf38}

P {text-indent: 10; color: # 9c0bb; font-size: 11pt}

P CODE {font-weight: bold; color: #c4a0cc; font-size: 10pt}

</style>

</head>

<BODY bgcolor="FFFF00">

<A href="A:\ЛабРаб1_2.htm">Возврат</a>

<P> </p>

<H1>Исользование стилей</h1>

<H2>Соловьёв Алексей Николаевич, г. Обнинск, ул. Энгельса, д. 1, кв. 82, (48439)5-27-93</h2>

<H3>МРНЦ Минздравсоцразвития РФ инженер (48439)9-71-57</h3>

<HR>

Текст, не отформатированный никаким стилем (т.е. формат по умолчанию).<BR>

<P style="text-indent: 0;font-size: 14pt; font-style: italic; color: #32522e"> Для этого

абзаца использован собственный (inline) стиль.</p>

<P>Это стиль, назначенный в элементе STYLE, для абзацев P всей страницы. В частности,

выбран отступ первой строки.</p>

<CODE background="red"> Свойства элемента CODE можно переопределить, например, задать фон</code>

<P>

<P><CODE> А этот стиль действует, если элемент CODE вложен в элемент P </code></p>

<HR>

</body>

</html>

Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]