Автор: Пользователь скрыл имя, 11 Ноября 2011 в 18:43, реферат
Точно рассказано о том как легко и просто своими руками научиться создавать сайты
– для
абзаца определить шрифт Verdana, размер шрифта
14 пикселей, цвет – темно-синий, текст
абзаца – курсивный и полужирный, выровненный
по ширине, расстояние между буквами в
словах 1 пиксель, а межстрочный интервал
– 1.4.
2. Вынесите стили в элемент <style>, который располагается в контейнере <head>. Сохраните файл. Если все выполнено правильно, стиль документа останется неизменным.
3. Создайте
текстовый файл. Сохраните его с расширением
style.css. Перенесите содержимое, заключенное
в элемент <style></style> в этот файл.
В контейнере <head> html-документа подключите
файл style.css с помощью тега <link>. Если
все выполнено правильно, стиль документа
останется неизменным.
4. Используя
текст в сером треугольнике, дополнить
текущий html-документ блоком в соответствии
с макетом, представленным ниже.
ВНИМАНИЕ!
Технология CSS служит для максимально возможного разделения дизайна документа и его логической структуры |
Текст поместите в элемент <div></div>, присвойте имя класса <div class=”select”>. Создайте в файле style.css класс с именем select и опишите блок:
– ширина элемента 200 пикселей (свойство width);
– выравнивание элемента по правому краю (свойство float);
– ширина отступа от четырех сторон блока 5 пикселей (свойство margin);
– граница элемента 2 пикселя, черный цвет, сплошная линия;
– ширина отступа между границей и текстом 10 пикселей (свойство padding);
– шрифт Verdana 10 пикселей, полужирный;
– выравнивание
текста по ширине.
Для выделения
текста «ВНИМАНИЕ!» создайте новый элемент
<div
class=”attention”>ВНИМАНИЕ!</
Аналогично в файле style.css определите следующий стиль:
– выравнивание текста по центру;
– высота
нижнего отступа текста 10 пикселей
(свойство margin-bottom).
5. Определите
блок <div id=”link”>Читать далее >></div>,
используя уникальный идентификатор,
задайте стиль для этого блока в файле
style.css: шрифт Arial 14 пикселей, наклонный,
выравнивание по правому краю.
Добавьте
элемент <a> для создания ссылки.
Определите цвет ссылки – серый, тест
– неподчеркнутый, а при наведении курсора
мыши цвет ссылки меняется и появляется
подчеркивание элемента.