Олег Мохов "О чём ещё говорят верстальщики"

О чём ещё говорят верстальщики?

Я.Субботник, Челябинск, 25 февраля 2012 года

Разработчик интерфейсовОлег Мохов

CSS3

2

CSS3

2

CSS3

3

CSS3 Первое упоминание в 1999

3

CSS3 Первое упоминание в 1999

Более 50 модулей

3

CSS3 Первое упоминание в 1999

Более 50 модулей

3 модуля рекомендованы

3

CSS3 Первое упоминание в 1999

Более 50 модулей

3 модуля рекомендованы

4 модуля в кандидатах

3

4

4

4

5

6

Firefox 4IE9

ChromeSafari

Opera

7

Firefox 4IE9

ChromeSafari

Opera

7

8

8

9

9

10

11

11

12

position: relative

position: relative

:before { position: absolute; top: 0; bottom: 0; left: 0; right: 0}

position: relative

:before { position: absolute; top: 0; bottom: 0; left: 0; right: 0}

position: relative

:before { z-index: -1}

:before { z-index: -1}

:before { box-shadow: ...}

:before { box-shadow: ...}

17

18

Photoshop Browser

Photoshop Browser

Photoshopsmoothness

100%

Photoshopsmoothness

0%

Browser

23

.b-mail-list:not(:last-of-type):after{ content: ', '}

24

25

25

26

27

28

29

29

.b-button:after, .b-button:before { transition: 0.5s opacity linear;}

.b-button:after {    opacity: 0;}

.b-button:hover:before { opacity: 0 !important; }

.b-button:hover:after { opacity: 1 !important; }

30

background: linear-gradient(top, #c5c5c5 0, rgba(197,197,197, 0) 3px), 

linear-gradient(-170deg, #c5c5c5 0, rgba(197,197,197, 0) 4px),

linear-gradient(-10deg, #c5c5c5 0, rgba(197,197,197, 0) 4px),

#fff;

.b-menu__layout-cell:first-of-type .b-tabbed-pane__tab:not(.b-tabbed-pane__tab_state_current):after,

.b-menu__layout-cell:last-of-type .b-tabbed-pane__tab:not(.b-tabbed-pane__tab_state_current):before

Ложка дёгтя

.b-block:not(.hidden):last-of-type{ margin-right: 0;}

37

.b-block:last-of-type:not(:hidden){ display: block;}

38

.b-block <~ .b-block:not(.hidden){ display: block;}

39

.b-block:has-support(flexbox){ display: box;

width: auto;}

40

41

CSS3 Первое упоминание в 1999

Более 50 модулей

3 модуля рекомендованы

4 модуля в кандидатах

http://lab.simurai.com/css/umbrui/

http://lab.simurai.com/css/buttons/

http://yuri.ya.ru/replies.xml?item_no=4484

За сколько вы это сверстаете?

2

– 402

– 402

18

18>

18>

О, если бы я только имел время на оценку,

я бы...

Когда успевать заниматься всем этим?

«Самая интересная часть работы, начинается тогда, когда

заканчивается рабочий день»

http://yuri.ya.ru/replies.xml?item_no=4484

Верстальщик[email protected]: @olmokhov

Олег Мохов