Заглавная страница Избранные статьи Случайная статья Познавательные статьи Новые добавления Обратная связь FAQ Написать работу КАТЕГОРИИ: АрхеологияБиология Генетика География Информатика История Логика Маркетинг Математика Менеджмент Механика Педагогика Религия Социология Технологии Физика Философия Финансы Химия Экология ТОП 10 на сайте Приготовление дезинфицирующих растворов различной концентрацииТехника нижней прямой подачи мяча. Франко-прусская война (причины и последствия) Организация работы процедурного кабинета Смысловое и механическое запоминание, их место и роль в усвоении знаний Коммуникативные барьеры и пути их преодоления Обработка изделий медицинского назначения многократного применения Образцы текста публицистического стиля Четыре типа изменения баланса Задачи с ответами для Всероссийской олимпиады по праву Мы поможем в написании ваших работ! ЗНАЕТЕ ЛИ ВЫ?
Влияние общества на человека
Приготовление дезинфицирующих растворов различной концентрации Практические работы по географии для 6 класса Организация работы процедурного кабинета Изменения в неживой природе осенью Уборка процедурного кабинета Сольфеджио. Все правила по сольфеджио Балочные системы. Определение реакций опор и моментов защемления |
Теги таблиці, рядка і комірки, теги заголовків таблиць. Логічне форматування таблиць.Содержание книги
Поиск на нашем сайте
Таблиця – один з найважливіших інструментів для створення web-сторінок. Навіть без використання CSS, тільки за допомогою таблиць можна створювати сторінки зі складним дизайном. Будь-яка таблиця – це набір рядків та стовпчиків. з точки зору HTML: сама таблиця задається за допомогою тегів <table> </table>, у таблиці є назва – тег <caption> </caption>, таблиця складається з рядків – теги <tr> </tr>, кожен рядок складається із стовпців – теги <td> </td>, стовпці мають назви, розташовані в першому рядку – теги <th> </th>. Створимо таблицю, де в якості вмісту вкажемо перетин номерів рядків і стовпців, <body> <table> <caption> Назва таблиці </caption> <tr> <th> 1 </th> <th> 2 </th> <th> 3 </th> </tr> <tr> <td> a/1 </td> <td> a/2 </td> <td> a/3 </td> </tr> <tr> <td> b/1 </td> <td> b/2 </td> <td> b/3 </td> </tr> <tr> <td> c/1 </td> <td> c/2 </td> <td> c/3 </td> </tr> </table> </body>
Для цього у тега <table> існує ряд параметрів: width – задає ширину таблиці (в пікселах або % від ширини екрану), bgcolor – задає колір фону комірок таблиці, background – заливає фон таблиці малюнком, border – задає рамку зазначеної ширини (у пікселях) навколо всієї таблиці, cellpadding – задає відступ в пікселях між межею клітини і її вмістом. align – задає вирівнювання таблиці: зліва (right), праворуч (left), по середині (center), cellspacing – задає відстань між осередками таблиці (у пікселях), cellpadding – задає відстань між текстом і внутрішнім краєм осередка таблиці (у пікселах). Взагалі, за краї відповідають два параметри: frame – задає вид рамки навколо таблиці і може приймати такі значення: void – рамки немає, above – тільки верхня рамка, below – тільки нижня рамка, hsides – тільки верхня і нижня рамки, vsides – лише ліва та права рамки, lhs – тільки ліва рамка, rhs – тільки права рамка, box – всі чотири частини рамки. rules – задає вигляд внутрішніх країв таблиці і може приймати такі значення: none – між осередками немає країв, groups – межі лише між групами рядків та групами стовпців (будуть розглянуті трохи пізніше), rows – межі лише між рядками, cols – межі тільки між стовбцями, all – відображати всі межі. Слід зауважити, що межі в різних браузерах можуть відображатися по-різному. HTML теги <tr> і <td> Таблиці формуються порядково. Тому, задані в рядку (<tr>) параметри поширюють свою дію на всі комірки (<td>) рядка. У рядків можна використовувати три параметри: align – вирівнює текст в осередках горизонтально, може мати такі значення: right – ліворуч, left – праворуч, center – по середині, valign – вирівнює текст в осередках по вертикалі, може мати значення: top – вгору, bottom – вниз, middle – по центру, bgcolor – задає колір рядка. Ці ж параметри можна застосовувати і до окремих осередків, тобто до будь-якого тегу <td>, дія поширюватиметься тільки на сам осередок. Але до комірок можна застосовувати ще два параметри: width – задає ширину шпальти (у пікселях або у відсотковому співвідношенні, де за 100% приймається ширина таблиці), height – задає висоту комірки, причому всі клітинки в цьому рядку стануть цієї ж висоти. Слід зазначити, якщо не задавати ширину і висоту, то таблиця буде формуватися по вмісту.
Основні поняття CSS, їх призначення та використання при форматування HTML-документа. Каскадні таблиці стилів (Cascading Style Sheets) — спеціальна мова, що використовується для опису сторінок, написаних мовами розмітки даних. Найчастіше CSS використовують для візуальної презентації сторінок, написаних HTML та XHTML, але формат CSS може застосовуватися до інших видів XML-документів. Основним поняттям CSS є стиль - набір правил оформлення і форматування, який може бути застосований до різних елементів сторінки. CSS діє іншим, зручнішим і економнішим способом. Для присвоєння якому-небудь елементу певних характеристик потрібно один раз описати цей елемент і визначити цей опис як стиль, а надалі просто вказувати, що елемент, який необхідно оформити відповідним чином, повинен прийняти властивості описаного стилю.
Способи застосування CSS. Застосувати таблицю стилів до HTML-документу можна трьома способами: <link rel="stylesheet" type="text/css" href="mystyle.css" media="all" /> Зустрівши в HTML-документі цей тег, браузер завантажить з сайту CSS-файл (у нашому випадку це mystyle.css) і застосує до документа стилі, що містяться в ньому. Файл не повинен містити нічого, крім CSS-інструкцій. Зовнішній файл зі стилями зручний тим, що одні й ті ж стилі можна застосовувати до множини документів на сайті - в кожному з них достатньо лише вписати один рядок з елементом link. <style type="text/css"> Сам тег style (на відміну від link) може знаходитися в будь-якій частині документа, але звичайно його розміщують всередині елемента head. Іноді потрібно призначити стиль окремого елементу на сторінці, не застосовуючи зовнішніх стилів і елемента style. Типовий випадок - елемент зустрічається один раз в документі або на сайті, але вимагає особливого оформлення. Скористаємося атрибутом style (саме атрибутом елементів, а не елементом!): <p style="color: red">
|
||||
Последнее изменение этой страницы: 2016-08-10; просмотров: 957; Нарушение авторского права страницы; Мы поможем в написании вашей работы! infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 3.140.197.140 (0.005 с.) |