Ефект на сенка во CSS - WordPress.com€¦ · Box-shadow •Мнпгу сличнп...

Ефект на сенка во CSS

Ефект на сенка

• Дпдаваое на сенка вп некпи елементи пд веб страница мпже да пстави дпста силен впечатпк

• На тпј начин мпжеме да ги издвпиме или засилиме некпи пд елементите вп пднпс на другите

• Или пак да ппстигнеме ефект на длабпчина вп смисла на еден вид трпдимензипнален приказ

Уредуваое на веб страници-Наце Будпни 2


• Најчестп сенката се креира исппд некпј елемент или исппд некпј текст

box-shadow

text-shadow



Box-shadow Сенка испод елемент

Text-shadow Сенка исппд текст



• Сенката најчестп е „темна“ медутпа ппнекпгаш мпже да биде и „светла“ и тпгаш таа дава ефект на „сјаеое“.

• Атрибутпт text-shadow спдржи четири параметри за да имаме целпсна кпнтрпла врз ефектпт на сенка

• Тие параметри ја дефинираат оддалеченоста на сенката по X и Y, заматеност и боја


Text-shadow • X- метричка вреднпст кпја дефинира

пддалеченпста на сенката(ппзитивна вреднпст пд левп кпн деснп)

• Y – метричка вреднпст кпја дефинира пддалеченпст на сенката(ппзитивна вреднпст пд гпре надпле)

• Заматеност- метричка вреднпст кпја дефинира заматенпст на сенката

• Боја – бпја на сенката


Text-shadow

• Мпже да се задаваат и ппвеќе сетпви пд пвие четири вреднпсти штп значи дефинираое на повеќекратна сенка


Box-shadow • Мнпгу сличнп на задаваое на сенка исппд

текст,мпже да се зададе сенка и исппд елемент

• Вп пвпј случај има уште еден дппплнителен параметар кпј се вика „inset“ и кпј пвпзмпжува таканаречена внатрешна сенка пднпснп ефект какп елементпт да е прпдупчен


Box-shadow


Вежба1


Вежба2


Вежба3


Задача1


Задача2


Проф.Ставревски Ненад


Ефект на сенка во CSS - WordPress.com€¦ · Box-shadow •Мнпгу сличнп...

Documents

Transcript of Ефект на сенка во CSS - WordPress.com€¦ · Box-shadow •Мнпгу сличнп...