Рамки в HTML, вложени таблици, CSS, определяне на границите
Фиг. 3.1. Рамката, получен чрез границата на параметъра
Netscape имитира триизмерен рама, Opera браузър като цяло оставя цвета непроменен и Internet Explorer прави солидна рамка.
Пример 3.1. Използването на границата
| съдържание |
граница параметър определя дебелината на границата, BORDERCOLOR - нейният цвят, cellpadding определя разстоянието от рамката, за да на съдържанието на таблицата.
вложени таблици
Друг прост и универсален метод за изграждане на рамка, работещи по същия начин в различните браузъри, базирани на суперпозиция на двете таблици, по един за друг. Ако вземем правоъгълник, например, червена хартия и отгоре на това ще наложи друг правоъгълник на бяло, малко по-малък, можем да видим червена рамка. Само вместо на лист хартия с помощта на маркер на маса, маси и цветовете се дефинират параметъра BGCOLOR.
Пример 3.2. Използването вложени таблици
|
В горната таблица набор ширина и височина по желание параметър маса BGCOLOR задава цвят рамка, cellspacing възлагат нула, и контроли cellpadding граница дебелина. Колкото повече е тази стойност, толкова по-дебела ще бъде рамката.
За вътрешна таблица е необходимо да се уточни цвета му е различен от цвета на външната страна, което съвпада с цвета на фона на уеб страница, в примера, например, създаде бяло. Параметър cellspacing или cellpadding (в този случай, без значение кой от тях да се използва) разстоянието от границата на рамката за съдържанието на масата.
Ширината и височината на вътрешната масата трябва да съответства на ширината и височината на външния масата.
Забележка: Текстът на линията на HTML трансфер добавя автоматично пространство. Ако границата на някои места се оказва по-дебел от предназначение, трябва да премахнете излишните интервали между таговете, и по този начин да намали броя на редовете.
Цвят на запълване на клетка от таблицата
Използване на цвета на фона на клетки от таблица - един от най-универсалните и общи начини за създаване на рамки. Създайте таблица (фиг. 3.2) и се напълни с екстремните клетките правилния цвят (фиг. 3.3).
Дебелината на рамката, определена от ширината и височината на клетките. Не забравяйте да поставите във вътрешността на клетките на подпората на масата - ясен модел на 1 с 1 пиксел (в този пример се нарича spacer.gif), в противен случай в браузъра Netscape, този метод няма да работи.
Пример 3.3. Създаване на цвят рамка засенчване на клетки от таблица
| височина = "2"> | ||
| височина = "2"> | съдържание | височина = "2"> |
| височина = "2"> | височина = "2"> |
Този пример е червена рамка 2 пиксела дебелина, изглежда по-елегантен. Параметри на маса cellpadding cellspacing и приравни на нула, така че рамката остава желаната дебелина и без пропуски. Ако поставите една маса вътре в текста, той ще се придържа към рамката, която е грозна и трудно да се чете. За да добавите може да бъде създаден компенсации за тази цел, допълнителни клетки, използвайте вложено маса или да използват стилове.
Забележка: Горният метод е чувствителна към различни параметри, така че в случай на неправилно предадено на рамката, проверете следното:
Декоративна рамка
След отрязване модел на част 8 получат фрагменти:
Пето фрагмент рамка не е (5.gif), защото имаме да го замени на съдържанието. Сега създадете таблица 3x3, както е показано на фиг. 3.2 и на нейно място клетки, създадени чертежи.
Пример 3.4. Създаване на декоративна рамка
| ширина = "1"> | ||
| съдържание | ||
| ширина = "1"> |
Таблица параметри на границите, cellspacing cellpadding и трябва да бъде нула, в противен случай линиите няма да се скачи с един на друг.
Corners вкарани като нормални модели, с помощта на маркера IMG, но хоризонталните и вертикалните линии трябва да се определят с фон на клетка в таблицата, настройка фон. Това ще направи нашия мащабируема конструкция и размера на това ще варира в зависимост от съдържанието.
За линията здраво помежду си и между тях не е имало пропуски, е необходимо да се посочват всички размери на клетката и модели.
В клетките, където фона са поставени хоризонталните и вертикални линии, е необходимо да се постави спейсер - е или интервал или прозрачен GIF формат размер снимка 1 от един пиксел (в пример файл, наречен spacer.gif на). Това се прави, за да подвежда браузъра Netscape, която не показва съдържанието на клетката, когато е празен.
Горният метод ви позволява да създадете почти всякакъв вид рамка.
Използване на стилове
Използване на стилове на кадрите могат да бъдат приложени към всеки блок-маркер, например, параграф (етикет P), и таблица DIV тагове. Стилове ви позволяват да се създаде рамка е по-лесно и по-удобно, отколкото с помощта на таблици и предоставя различни видове рамки, които са показани на фиг. 3.6.
Фиг. рамка 3.6 тип се определя с стиловете
Първите два вида рамки - точките и тиретата поддържаните браузъри Netscape и Internet Explorer само с по-стари версии.
Рамката е настроен лесният граница параметър. който веднага показва, външния му вид, дебелина и цвят.
Пример 3.6. Използване на стилове
При работа на компютърните технологии е необходимо да седне, така че
ръцете до лактите с образуват прав ъгъл, очите, пуснати на
30-40 см от повърхността на работа на монитора.
Примерът използва двойно граница, дебелината на които се състои от линия ширина и разстояние. Така че рамката не е в контакт с текста, тире от рамката на съдържанието на опцията за пълнеж.
Забележка: браузър Netscape 4.x The не добавяне на рамка за таблиците и ограничава ширината на рамката и съдържанието му.
Осъществено от uCoz