CSS Framework: Impromptu и ефект
Каскадните стилове (CSS) за цялата логическа простота позволяват не само да се създаде грандиозно дизайнерско решение, но и да се осигурят елементи с действително действие, за да се подражава на изпълнението на истински код.
Всеки визуален маркер на HTML маркировка е правоъгълна област на специфична структура и съдържание. Елементът се състои от посочване на координати, размер, пълнеж, цвят, шрифт, шрифт стил, и така нататък. Frame CSS-елемент ги определя окупираната зона са разположени навътре от границите му върху определен тук ширина.
Описание Синтаксис
Зоната на поставяне на елемента се определя от координатите спрямо горния ляв ъгъл на страницата (вляво, отгоре), размера на хоризонталната и вертикалната (ширина, височина). Целият дизайн и анимация на елемента се извършват по двойки: "property: value".
Описанието се изпълнява директно в кода на страницата, в стиловата вложка или в отделен файл, сочейки го с линка LINK. синтаксис:
#name {собственост: стойност-собственост: стойност-собственост: стойност ...}
или
.име {property: value-property: value-property: value -...}
Името може също така да бъде p, body, html, table, td ..., т.е. името на маркиращия маркер HTML. Допуска се свързването на описанието на стила директно към елемента.
Преди да направите до моя собствен стил на писане, не боли, за да видите как се прави на най-популярните сайтове, запазвайки кода на страницата, или чрез натискане на Ctrl-U за да го видите директно в браузъра.
Основни параметри
Действителният CSS кадър за елемента е представен от стила (граничен стил), цвят (граничен цвят), ширина (ширина на границата). Можете да опишете всичко със същата собственост - граница. Възможно е всяка граница на рамката да се опише независимо (граница отгоре, граница-долу, граница-ляво, гранично-дясно).
CSS рамката е описана от общите правила на каскадни стилови листа:
граница: 3px;
граничен цвят: червено-
граничен стил: двойно пунктирана солидна точка.
Това описание определя граничния ширина от 3 пиксела, цвят - Гарнитура за червено, Стил: горната страна на двойно, нали - прекъсната, твърди отдолу, отляво - точка.
ширина на границата: 1px 2px 4px 8px;
граничен цвят: синьо-
граничен стил: пунктиран.
Тук размерите на всяка страна също са показани последователно, като се започне от горната, по посока на часовниковата стрелка, цветно - синьо и стилно пунктирано.
граничен цвят: синьо червено-зелено черно;
в това описание цветът на всяка страна е обозначен отделно. Границата собственост може да включва няколко параметъра наведнъж, а ъглите на границата могат да бъдат закръглени:
граница: 1px green solid-
радиус на границата: 0px 4px 8px 12px;
-моз-граница-радиус: 0px 4px 8px 12px;
-webkit-border-radius: 0px 4px 8px 12px;
На това как да направите рамка в CSS, удобството на посетителя зависи, тъй като обикновено този стил ефект се използва за технически цели: когато е важно да се покаже точно мястото или размера на областта на страницата.
Дебелината на рамката и нейната цел
Избирайки дебелината на рамката, можете да използвате px, pt, em ..., но трябва да имате предвид, че тя винаги е в района на елемента. Трудно е да си представим, че рамката на CSS има конструктивна цел, но технически е много удобно да я използваш, за да подчертаеш елементите на страницата.
Ако основният клас рамка е заключена, че отсъства, като го посочва в псевдо-клас: навъртам, може да се показва на потребителя, на елемента на страница, когато е курсора на мишката, като се подчертава елемент от менюто. Понякога трябва да изберете нещо, като кликнете върху снимката или плъзнете нещо някъде. Много е удобно да използвате пунктирана рамка, а не да променяте фона на елемента или неговото съдържание.
Някои приложения трябва да изберат регион на страница или да изберат елементи за последваща обработка. В този случай можете да създадете дял с рамка в момента на щракване и докато посетителят освободи бутона на мишката, преоразмерите го, визуално визуализира резултата от селекцията.
Извън предвидените
Уроците по CSS са много интересни, също е важно да се проучат кодовите страници на популярните сайтове. Собственият ресурс обаче трябва да е уникален, той трябва да има свое лице.
Рамката на CSS, предоставена от синтаксиса, не дава толкова голямо разнообразие, колкото собствената си инициатива. Impromptu е чудесно начало и нищо не възпрепятства разработчика да оформя собствената си рамка. Особено с всички постижения на интернет технологиите и възможностите на съществуващите стандарти са много обещаващи идеи на базата на реални недостатъци на съществуващата синтаксиса, който е (по дефиниция) винаги е бил строго официално.
По-конкретно, ако трябва да създадем рамката на тези или други елементи, изглежда разумно да направим това по изчерпателен начин. Като подчертавате страните и ъглите на определена област в отделни етикети, можете да получите зашеметяващи ефекти. А чрез задаване на подходящите манипулатори можете да създавате динамични елементи на страницата, да променяте позицията, формата и съдържанието.
- Подробности за това как да направите смел шрифт в "VK"
- CSS позиция: примери
- Имотът css `transparency `е лесен начин да направите дизайна на сайта по-интересен
- Блокиране на оформлението на div маркерите HTML
- Използване на свойството CSS `display: none`
- Структура на HTML документа: основни етикети, пример
- Списък на основните HTML тагове
- CSS ефекти: закръгляване на ъглите на елементите
- Overflow CSS: показване на съдържанието на елемент
- CSS: цвят на шрифта, стилове, фон, размер
- HTML атрибути: изгледи и приложения. HTML-водач
- Най-горе в страницата CSS: позициониране на съдържанието
- Как да вмъкнете вградената рамка в HTML: пример за използване
- Използване на DOM елементи чрез jаvascript getElementById
- Искания за медии CSS - описание, използване и препоръки
- CSS марж собственост: външна вдлъбнатина на елементи
- Функцията за завъртане в CSS: двуизмерното въртене на елемент
- Декориране на уеб страница и размер на шрифта в HTML
- Главна буква в html и css
- Как да направите смел шрифт в CSS?
- Направете сами хоризонтално меню за сайта