Олег Мохов "О чём ещё говорят верстальщики"
DESCRIPTION
Олег Мохов "О чём ещё говорят верстальщики" Я.Субботник в Челябинске в рамках конференции UWDC О докладе: О чем говорят верстальщики? О новых CSS-свойствах, о красивых деревьях, о BEM и Bootstrap. А о чём ещё говорят верстальщики?TRANSCRIPT
О чём ещё говорят верстальщики?
Я.Субботник, Челябинск, 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
Олег Мохов