css

font-smoothing

font-smooth - pozwala na kontrolę wygładzania czcionek podczas ich renderowania.   Obecnie właściwość font-smooth nie jest u standaryzowana i nie zaleca się korzystania z niej...

rem – Root EM

skalowanie jednostki tekstu względem głównej (root) wartości. html{font-size: 10px;} body {font-size: 1.4rem} h1{width: 2.4rem} czyli: body => html font-size * 1.4 =...

BEM czyli Block, Element, Modifier

metodologia tworzenia kodu, tworzenie kodu z podziałem na konstrukcyjne części.   cel: uniknięcie specyficzności i dziedziczenia selektorów CSS   Założenia: każdy...

Counter – licznik css

Counter - licznik css wartość ustawiana poprzez: counter-reset i counter-increment wyświetlanie poprzez funkcję counter(), counters()   css: body { counter-reset:...

css3 gradient

- background-image: linear-gradient(red, yellow); background-image: linear-gradient(to left, red, yellow); background-image: linear-gradient(30deg, red, yellow); background-image:...

CSS Cascading Style Sheets

CSS Cascading Style Sheets style css = reguły css wykaz selektor - wskazuje formatowany element strony, jako klasa(.) lub identyfikator(#) blok deklaracji - rozpoczęty { i zamknięty...

transition

płynne przejście jednej wartości css do drugiej. -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; parametry...

pulsujące serce

ikona pulsującego serca (lub dowolnego innego symbolu, znaku).   1.ikona osadzona jako czcionka - Awesome w head zamieszczamy: w kodzie html: <span class="fa fa-heart...

Bezpieczne czcionki web

Wykaz bezpiecznych czcionek do zastosowań web.   osadzanie: font-family: "Times New Roman", Times, serif;   Serif Fonts:  font-family: Georgia, serif; font-family:...

LESS

Less - dynamiczne arkusze stylów   dobre praktyki: do komentarzy używaj // zamiast /* .. */ używaj mixins z parametrami kompilując kod LESS minifikuj CSS twórz kod...

skośne, responsywne tło w stylach css

Uzyskanie skosów w responsywnym tle, na górze czy dole bloku uzyskujemy poprzez: <style>   body{     background:#e22117;     padding-top:120px;   }   section {     ...

preprocesor SASS

Syntactical Awesome StyleSheet- język skryptowy, którego kod przetwarzany jest do plików wynikowych kaskadowych arkuszy stylów - CSS. SASS można rozumieć, jako dodatkową warstwę lub...

quotes – cytaty

określenie stylu w jaki zostaje wyróżniony cytat q { quotes:"<<" ">>"; } q::before { content:open-quote; } q::after {...

counter – licznik

counter pozwala na automatyczną numerację wybranych elementów bez konieczności tworzenia z nich listy numerowanej.   resetowanie licznika by zacząć od wartości 0 przypisujemy...

outline – kontur

jest przypisywany całemu elementowi bez możliwości rozbicia na poszczególne składowe (top, left, right,...

kursor

wygląd kursora możemy określić...

obramowanie border

border: border-style none hidden solid - linia ciągła dotted - linia kropkowana dashed - linia kreskowana double - podwójna linia groove - efekt 3D z cieniem na górze ridge...

tło, background

parametry: background-color:#e22117; background-image:url(bg_pic.png); background-repeat: repeat (default) - powiela obrazek horyzontalnie i wertykalnie repeat-x - powiela...