вівторок, 28 грудня 2010 р.

Додавання каскадних таблиць стилів CSS до HTML

Застосовувати каскадні таблиці стилів до HTML сторінок можна трьома способами:
1. Безпосередньо до кожного елементу. Здійснюється за допомогою параметру тегу style. Наприклад: <body style="background:#ff6600;">.
2. З указанням класів та ідентифікаторів на кожному тезі, а потім розміщенням тегу <style></style> між тегами <head></head>. Наприклад:
<head>
<style>
body {background:#ff6600;}
</style>
</head>
<body>
</body>

3. З указанням класів та ідентифікаторів на кожному тезі, та прикріпленням документу стилів до сторінки.
Наприклад:
<head>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
</body>

понеділок, 27 грудня 2010 р.

Основні відомості про каскадні таблиці стилів CSS

CSS - "спеціальна мова, що використовується для відображення сторінок, написаних мовами розмітки даних. Найбільш часто CSS використовують для візуальної презентації сторінок, написаних HTML та XHTML, але формат CSS може застосовуватися до інших видів XML-документів." Вікіпедія
Раніше дизайн сторінок формувався за допомогою мови HTML (параметрами для кожного елементу). Це було незручно, тоді коли у вас великий сайт і вам, щоб змінити якусь частину дизайну, потрібно було заходити на кожну сторінку сайту, і правити ту частину, яку потрібно змінити.
При появі каскадних таблиць стилів (CSS), все змінилося. Тепер потрібно тільки кожний елемент, при написанні сайту, умовно назвати, та прикріпити файл стилю до кожної сторінки (в HTML не робити ніякого оформлення). Потім в файлі CSS описувати оформлення тим названим елементам сайту. Цей метод зручний, коли потрібно змінити дизайн сайту, просто замінюється файл стилю на інший (з таким самим ім'ям) і все на сторінках змінило стиль.
Стиль можна задавати: по назвам тегу, по класам тегів та по ідентифікаторам. При встановлені параметрів по тегу стиль застосовується для всіх таких тегів сторінки. При встановленні по класам, то стиль застосовується до тегів з таким вказаним класом. При вказанні стилю по ідентифікатору, такий елемент може бути тільки один, бо ідентифікатори на сторінці не повинні повторюватися.
Синтаксис. Синтаксис в CSS на перший погляд простий. Спочатку йде назва елемента, потім в фігурних дужках, через крапку з комою, всі параметри стилю для цього елемента. Параметри стилю задаються: спочатку назва параметру, потім дві крапки, а після цього значення цього параметру.
Наприклад:
Застосування до тегу <p>:
p {font-size:20pt;color:#ff0000;}

Застосування до класу <p class="top">:
.top {font-size:30pt;color:green;}

Застосування до ідентифікатора <p id="el1">:
#el1 {font-size:10pt;color:blue;}