Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью css 2



Скачать 20.25 Kb.
Дата26.07.2014
Размер20.25 Kb.
ТипДокументы

Содержание




Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью CSS 2

Списки 4


Формы 5

Псевдоэлементы и псевдоклассы 5

Списки 5

Таблицы 6

Формы 7




Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью CSS


Задание 1.

Добавьте на страницу контейнер класса «content» с параметрами:



  1. Высота – 500px;

  2. Ширина – 500px;

  3. Цвет фона – gold;

  4. Размер шрифта – 24px;

  5. Шрифт - Courier New;

Задание 2.

Создайте общий контейнер класса «conteinet» с параметрами:



  1. Ширина – 750px;

  2. Высота – 500px;

В общий контейнер поместите 2 блока.

Первый блок класса «left_menu» с параметрами:



  1. Ширина – 250px;

  2. Высота – 500px;

  3. Элемент выронить по левому краю

  4. Цвет фона – yellow;

  5. Стиль границ – dotted;

  6. Цвет границ- blue;

Второй блок класса «content» с параметрами:

  1. Ширина – 500px;

700 px

200 px


HEADING

MENU


CONTENER

FOOTER


100 px

500 px


200 px

500 px


Высота – 500px;

  1. Элемент выронить по правому краю

  2. Цвет фона – gold;

  3. Стиль границ – dotted;

  4. Цвет границ- blue;

Задание 3.

Разделите страницу на 5 блоков.


Списки


Задание 1.

Измените с помощью css маркеры у списков.



Задание 2.

В Photoshop был разработан простой шаблон веб-страницы. Продумайте, как лучше разрезать шаблон.

С помощью css и блоков попробуйте собрать страницу в единый шаблон.

Результат.


Формы


Задание 1.

Создайте форму для входа в систему и установите для элементов стиль .




Псевдоэлементы и псевдоклассы

Списки


Задание 1.

Наведя курсор на элемент списка, меняется маркер элемента. Элемент выделяется другим цветом и устанавливается промежуток между буквами.



Задание 2.



  • Создайте список

    • Телефоны

    • Фотокамеры

    • Ноутбук

    • Другие устройства

    • Офисная мебель

  • Наведя курсор на элемент списка, меняется курсор

  • К каждому элементу списка примените разные курсоры.

Ресурс: http://site-for-girls96.narod.ru/kyrsori1.html

Задание 3.

С помощью css реализуйте следующие эффекты страницы.


Таблицы


Задание 1.

Пропишите параметры, изменяющие внешний вид таблицы, когда пользователь наводит на строку и ячейку.


Формы


Задание 1.

Добавьте к форме для входа в систему стиль для элемента, получающего фокус.

Похожие:

Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью css 2 iconСамостоятельная работа №2 Тема: «css и формы» Вариант №1 Что такое css? Назначение css. Каков общий синтаксис записи стилей?
Назовите атрибут и его значения, с помощью которого можно задать позиционирование элементов в css?
Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью css 2 iconУрок 1: Что такое css? Немного о том, почему появился css и почему лучше использовать css поверх html для дизайна страниц
В этом уроке мы рассмотрим, как редактировать перекрывание элементов с помощью layers
Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью css 2 iconПериодический закон Д. И. Менделеева и система химических элементов. Свойства нейтральных атомов
...
Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью css 2 iconЭлементы управления Свойства элементов
...
Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью css 2 iconСуществуют четыре способа связи css с html-документом
Таблица стилей существует в виде отдельного текстового файла с расширением css (желательно, чтобы он находился в той же папке,что...
Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью css 2 iconСтилевое форматирование текста – css css
Ение оформления и содержания. Содержание веб-страницы хранится в html-файле, оформление – в css-файле
Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью css 2 iconОсновы синтаксиса css и создание вашей первой таблицы стилей. Селекторы. Псевдоклассы и псевдоэлементы
Немного о том, почему появился css и почему лучше использовать css поверх html для дизайна страниц
Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью css 2 iconИспользование css (листов каскадных стилей) Немного о css
Таблицы Каскадных Стилей это язык, содержащий набор свойств для описания внешнего вида любых html документов. С его помощью дизайнер...
Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью css 2 iconИспользование css в xml-документах
Так что это такое Сss? Cascading Style Sheets ( Таблицы Каскадных Стилей ). Css это язык содержащий набор свойств для определения...
Контейнеры и блочные элементы. Свойства элементов, управляемых с помощью css 2 iconЭлементы комбинаторики
Пусть множество A1 содержит элементов, A2  элементов,…, Ak  элементов. Тогда A1A2…Ak содержит различных элементов
Разместите кнопку на своём сайте:
ru.convdocs.org


База данных защищена авторским правом ©ru.convdocs.org 2016
обратиться к администрации
ru.convdocs.org