Типографика: восток – Роман Прудников, 2ГИС
-
Upload
fronttalks-conference -
Category
Internet
-
view
78 -
download
6
Transcript of Типографика: восток – Роман Прудников, 2ГИС
-
Typography: from metal to pixels
https://youtu.be/EuXrh_T2aLg
4
https://youtu.be/EuXrh_T2aLg
-
5
-
6
-
9
-
( )
80%
9
-
/
10
-
11
-
11
-
12
-
12
-
12
-
12
-
( )
(51 .)
24
13
-
14
-
14
-
14
-
14
-
14
-
16
-
16
-
16
-
18
-
21
-
22
-
23
-
26
-
27
-
31
-
WEB
-
writing-mode
p { writing-mode: vertical-rl;
}
37
-
writing-modep { writing-mode: vertical-rl, vertical-lr, horizontal-tb, sideways-rl, sideways-lr;
}
38
-
text-orientation
p { text-orientation: mixed
upright sideways;
}
39
-
text-orientation
p { text-orientation: mixed
upright sideways;
}
39
-
text-orientation
p { text-orientation: mixed
upright sideways;
}
39
-
text-orientation
p { text-orientation: mixed
upright sideways;
}
39
-
text-combine-upright
p { writing-mode: vertical-lr; text-combine-upright: digits 2; }
41
-
text-combine-upright
p { writing-mode: vertical-lr; text-combine-upright: digits 2; }
41
-
text-combine-upright
p { writing-mode: vertical-lr; text-combine-upright: all; }
42
-
text-combine-upright
p { writing-mode: vertical-lr; text-combine-upright: all; }
42
-
text-combine-upright
p { writing-mode: vertical-lr; text-combine-upright: all; }
42
-
word-break
p { word-break: break-all keep-all;
}
43
-
word-break
p { word-break: break-all keep-all;
}
43
-
word-break
p { word-break: break-all keep-all;
}
43
-
word-break
p { word-break: break-all keep-all;
}
43
-
list-style-type
44
-
list-style-type
ol { list-style-type: cjk-ideographic; }
44
-
list-style-type
ol { list-style-type: cjk-ideographic; }
one two three
44
-
list-style
45
-
list-style
ul { list-style: none; }
45
-
list-style
ul { list-style: none; }
li::before { content: ;
}
45
-
list-style
ul { list-style: none; }
li::before { content: ;
}
45
one two three
-
46
-
em::before { content:
}
46
-
em::before { content:
}
em::after { content:
}
46
-
em::before { content:
}
em::after { content:
}
46
-
47
-
47
-
WWorld WWide WWeb
47
-
Kan ji
48
-
49
-
(Ashita)
50
-
(Ashita)
51
-
(Ashita)
51
-
/ W3C Associate Chairman
52
-
ruby-
.reading { ruby-position: under; ruby-align: space-between; } .annotation { ruby-position: over; }
53
-
56
-
56
-
56
-
56
-
56
-
56
-
57
-
58
-
58
-
58
-
58
-
58
-
58
-
61
-
64
-
WEB
-
direction
66
-
direction
p { direction: rtl,
ltr; }
66
-
text-justify
67
-
text-justify
p { text-justify: kashida; }
67
-
text-justify
p { text-justify: kashida; }
68
-
! .
69
-
! .
70
-
! .
71
-
! .
72
-
.
73
-
.
74
-
unicode-bidip { unicode-bidi: normal; embed, isolate, bidi-override, isolate-override, plaintext;
}
75
-
padding/margin
78
-
padding/margin
p { padding-left: 10px; margin-right: 2px; }
78
-
padding/margin
p { padding-left: 10px; margin-right: 2px; }
78
-
padding/margin
p { padding-left: 10px; margin-right: 2px; }
78
-
padding/margin
p { padding-left: 10px; margin-right: 2px; }
78
p { padding-inline-start: 10px; margin-inline-end: 2px; }
-
text-align
79
-
text-align
p { text-align: left; }
79
-
text-align
p { text-align: left; }
79
-
text-align
p { text-align: left; }
79
-
text-align
p { text-align: left; }
79
p { text-align: start; }
-
position: absolute
-
position: absolute
p { position: absolute; left: 1337px; }
-
position: absolute
p { position: absolute; left: 1337px; }
-
position: absolute
p { position: absolute; left: 1337px; }
-
position: absolute
p { position: absolute; left: 1337px; }
p { position: absolute; offset-inline-start: 1337px; }
-
float
81
-
float
section { float: left; }
81
-
float
section { float: left; }
81
-
float
section { float: left; }
81
-
float
section { float: left; }
81
section { float: inline-start; }
-
!
82
Mozilla Building RTL goo.gl/6cQI2R Mozilla Building RTL 2 goo.gl/NH2lSk W3C: ruby http://goo.gl/DgwY2T W3C: writing modes http://goo.gl/5oT39m W3C: bidi Korean lessons http://goo.gl/Z77IVs hanzi.pro rtlcss.com
http://goo.gl/6cQI2Rhttp://goo.gl/NH2lSkhttp://goo.gl/DgwY2Thttp://goo.gl/5oT39mhttps://www.w3.org/International/tutorials/svg-tiny-bidi/Overview.ru.phphttp://goo.gl/Z77IVshttps://hanzi.pro/http://rtlcss.com/
-
,
-
?