
- •Лабораторна робота №1 Створення найпростіших Web-Сторінок. Форматування тексту засобами мови html
- •3.1 Практичні завдання:
- •Лабораторна робота №3 Каскадні таблиці стилів
- •Способи застосування css
- •Чому каскадні?
- •Спадкування
- •Синтаксис css
- •Псевдокласи
- •Коментарі
- •Параметри css
- •Одиниці виміру в css
- •Завдання кольору в css
- •Лабораторна робота №4 Розмітка сторінок за допомогою блоків (div) і css. Позиціонування
- •Теоретичні відомості
- •Як це робиться
- •Практичні завдання
- •Лабораторна робота №5 Форми
- •Теоретичні відомості:
- •Елементи керування форми
- •Списки вибору.
- •Практична частина
- •Лабораторна робота №6 Фрейми. Карти зображень
- •Теоретичні відомості: Фрейми
- •Карти зображень
- •Практична частина
- •Лабораторна робота №7 Динамічний html. Введення в Javascript
- •Теоретичні відомості:
- •Синтаксис мови програмування Javascript
- •Функції
- •Вбудовані об'єкти мови програмування Javascript
- •Вивід даних в Javascript
- •Практична частина
- •Лабораторна робота №8 Динамічний html. Об'єкти JavaScript
- •Теоретичні відомості: Елементи керування
- •Властивості об'єкта Document
- •Методи об'єкта Document
- •Практична частина
- •Лабораторна робота №9 Встановлення, налаштування Denwer. Мова програмування рнр.
- •Теоретичні відомості:
- •Створення власного домену на локальному комп'ютері
- •Принципи обробки сценаріїв php
- •Включення фрагментів рнр у html-код
- •Стандартні дескриптори
- •Короткі дескриптори
- •Дескриптори в стилі asp
- •Практична частина
- •Лабораторна робота №10 Мова програмування рнр. Змінні, типи даних, операції, керуючи оператори.
- •Теоретичні відомості
- •Типи даних
- •Строковий тип
- •Операції
- •Керуючі оператори
- •Практична частина
- •Лабораторна робота №11 Мова програмування рнр. Цикли. Структура вибору. Масиви. Функції.
- •Теоретичні відомості:
- •Використання функцій
- •Передача параметрів у функції
- •Практична частина
- •Лабораторна робота №12 Серверні додатки. Бібліотечні функції php
- •Теоретичні відомості
- •Функції обробки рядків
- •Практична частина
- •Лабораторна робота №13 Робота з базами даних. Утиліта РhpMyAdmin.
- •Теоретичні відомості
- •Термінологічний словник
- •Практична частина
- •Лабораторна робота №14 Доступ до бази даних MySql з використанням мови рнр.
- •Теоретичні відомості
- •Доступ до бази даних MySql з використанням мови рнр
- •MySql і проблеми безпеки
- •Екранування спецсимволів
- •Шаблони запитів і placeholders
- •Практична частина
- •Лабораторна робота №15 Виконання запитів до бази даних.
- •Теоретичні відомості
- •Вибір за шаблоном.
- •Функції
- •Практична частина
- •Додаток 1. Основні теги html
Коментарі
Як і в будь-якої досить складною мови, при створенні таблиці стилів можна користуватися коментарями.
Приклад:
/* Цей текст є коментарем */
Для невеликих сайтів ця можливість вам навряд пригодиться, а от при створенні складних, багаторівневих таблиць стилів коментарі можуть пригодиться..
Параметри css
Параметри шрифту
font-weight: [ bold | normal | number] - жирність шрифту
font-style: [normal | italic | oblique] - нахил шрифту
font-size: number - розмір шрифту
font-family: name - гарнітура шрифту
color: number - колір шрифту
background-color: number - колір подложки
background: url - текстурна подложка
Параметри абзацу
text-align: [ left | right | center | justify] - вирівнювання
text-indent: number - відступ червоного рядка
line-height: number - інтерліньяж
letter-spacing: number - трекинг
padding-left: number - відступ від тексту ліворуч
padding-right: number - відступ від тексту праворуч
padding-top: number - відступ від тексту зверху
padding-bottom: number - відступ від тексту знизу
margin-left: number - відступ від границі ліворуч
margin-right: number - відступ від границі праворуч
margin-top: number - відступ від границі зверху
margin-bottom: number - відступ від границі знизу
Одиниці виміру в css
У властивостях, де потрібно вказувати розмір, можна використовувати кілька способів для їхнього позначення:
відносний розмір у відсотках (%)
відносний розмір за допомогою словесного опису (larger, smaller, xx-small, x-small, small, medium, large, x-large, xx-large)
абсолютний розмір в типографських одиницях - розмір може задаватися в пунктах (pt), піках (pc), середньою шириною букви "m" (em), середньою шириною букви "x" (eх)
абсолютний розмір у стандартних одиницях довжини - розмір може задаватися в сантиметрах (cm), міліметрах (mm), дюймах (in)
абсолютний у пікселях (px)
Завдання кольору в css
Колір може бути визначено одним із трьох способів:
за допомогою назви кольору: yellow, red, green, grey, і т.д..
шістнадцятирічним завданням кольору у форматі #RRGGBB: #ff0000, #883490, #ffffff,..
десятковим завданням складових кольори у форматі rgb(red, green, blue): rgb(255,0,0), rgb(100,23,78),..
Практичні завдання:
Завдання 1.
Створіть каталог /css/
Створіть у ньому файл main.css
Підключіть його до всіх сторінок сайту за допомогою тегу <LINK>.
Задайте за замовчуванням наступні параметри для всіх сторінок (перевизначивши, тег <body>):
- колір фону
- розмір шрифту
- колір шрифту
- сімейство шрифтів (наприклад, Arial)
Перевірте працездатність на сервері.
В коментарях (файл main.css) поясніть ці параметри.
Завдання 2
Задайте за замовчуванням наступні параметри для всіх абзаців (перевизначивши, тег <p> та псевдокласи тегу <p>):
- вирівнювання абзацу
- відступ першого рядка
- розмір і колір першої букви
2.2 Перевірте працездатність на сервері.
В коментарях (файл main.css) поясніть ці параметри.
Завдання 3
Задайте за замовчуванням наступні властивості посилань для всіх сторінок:
- колір і оформлення посилання
- колір і оформлення посещенной посилання
- колір і оформлення активного посилання
- колір і оформлення посилання, у момент знаходження курсору миші над нею
Перевірте працездатність на сервері.
В коментарях (файл main.css) поясніть ці параметри.
Пред'явити роботу викладачеві (в браузері і Блокноті).
Оформити звіт. В звіт включити код і зображення створених Html-Сторінок