HTML5. Strony mobilne - Weyl E. - 2014 [skan ocr].pdf

(59499 KB) Pobierz
O ’REILLY
W YKORZYSTAJ POTENCJAŁ HTML5 NA URZĄDZENIACH MOBILNYCH!
h e lio n
Estelle Weyl
Spis treści
W p r o w a d z e n ie .............................................................................................11
1.
Przygotow ania do nauki interfejsów API HTML5, CSS3 i Jav aScrip tu .................. 25
CubeeDoo — gra na urządzenia przenośne napisana w HTML5
Narzędzia program istyczne
Edytor tekstu
Przeglądarka
Narzędzia do debugowania
Debugery stacjonarne
Zdalne debugowanie
Narzędzia do testowania
Emulatory i symulatory
Narzędzia dostępne w internecie
Telefony
Testy zautom atyzowane
2.
26
28
28
28
29
30
32
37
38
39
40
42
Przechodzenie na H T M L 5 .............................................................................. 43
Składnia języka HTML5
Elementy
Atrybuty
Atrybuty globalne i atrybuty internacjonalizacji
Atrybuty z HTML-a 4, które stały się globalne w HTML5
Now ość w HTML5 — globalne atrybuty zw iązane z dostępnością
i elementami interaktywnymi
Składnia elementów i atrybutów w HTML-u
Elementy sam ozamykające
Najlepsze praktyki
W ym agane komponenty
Elementy ze znacznika <head>
43
44
45
45
48
50
54
55
56
57
62
3
Elem ent <meta> — dodawanie metadanych
Znaczniki meta dla aplikacji mobilnych
W artości charakterystyczne dla producentów urządzeń przenośnych
Znacznik <base> dla strony internetowej
Znacznik <link> jest przydatny nie tylko dla arkuszy stylów
3.
63
64
66
67
67
Now e elementy w H T M L 5 ............................................................................. 75
Elementy sekcyjne w HTML5
Elem ent <section>
Elem ent <article>
Elem ent <section> a elem ent <article>
Elem ent <nav>
Elem ent <aside>
Elem ent <header>
Elem ent <footer>
N agłów ek i stopka w grze CubeeDoo
Stary, ale rzadko używ any element <address>
Grupowanie treści — inne nowe elementy HTML5
Elem ent <main>
Elementy <figure> i <figcaption>
Elem ent <hr>
Zm iany atrybutów elementów <li> i <ol>
Nowe tekstow e elementy sem antyczne w HTML5
Elem ent <mark>
Elem ent <time>
Elementy <rp>, <rt> i <ruby>
Elem ent <bdi>
Elem ent <wbr>
Zm odyfikow ane tekstowe sem antyczne elementy
Elem ent <a>
Zm iany w elementach tekstowych w porównaniu z HTML-em 4
Niezm odyfikow ane elementy
Elementy osadzane
Zm iany w elementach osadzanych
Elementy interaktywne
Elementy <details> i <summary>
Elementy <menu> i <menuitem>
Elementy XHTM L-a niedostępne w HTML5
W nioski
75
77
77
78
78
79
79
80
80
81
81
82
82
83
83
83
84
85
85
86
86
86
86
88
89
90
90
92
92
94
95
96
4
|
Sp s treśc
4.
Formularze internetowe w H T M L 5 ................................................................. 97
Atrybuty elementu <input> oraz innych elementów formularzy
A trybut type
A trybut required
W artości m inim alne i m aksym alne — atrybuty m in i m ax
A trybut step
A trybut placeholder
A trybut pattern
A trybut readonly
A trybut disabled
A trybut maxlength
A trybut size
A trybut form
A trybut autocom plete
A trybut autofocus
Typy i atrybuty elementu <input>
Ponowne w prow adzenie do typów, o których myślisz, że je znasz
Tekst — <input type="text">
Hasła — <input type="password">
Pole wyboru — <input type="checkbox">
Przycisk opcji — <input type="radio">
Przycisk wysyłania — <input type="submit">
Przycisk resetowania — <input type="reset">
Plik — <input type="file">
Ukryte pole — <input type="hidden">
Rysunki — <input type="image">
Przycisk — <input type="button">
Określanie stylów dla elementów <input> różnego typu
Nowe typy elementu <input>
Adres e-mail — <input type="email">
Adres URL — <input type="url">
Telefon — <input type="tel">
Liczby — <input type="number">
Przedziały — <input type="range">
W yszukiw anie — <input type="search">
Kolory — <input type="color">
Elementy <input> związane z datą i godziną
Daty — <input type="date">
Data i godzina — <input type="datetime">
Lokalna data i godzina — <input type="datetime-local">
M iesiąc — <input type="month">
99
99
99
100
101
101
102
104
104
105
105
105
106
107
107
108
108
109
109
110
111
112
112
114
114
114
114
115
116
117
118
119
121
122
122
123
123
125
125
125
Sps treśc
|
5
Godzina — <input type="time">
Tydzień — <input type="week">
Sprawdzanie popraw ności formularzy
Łatwe popraw ianie interfejsu użytkownika za pom ocą stylów CSS
Nowe elem enty form ularzy
Elem ent <datalist> i atrybut list
Elem ent <output>
Elem ent <meter>
Elem ent <progress>
Elem ent <keygen>
Inne elementy formularzy
Elem ent <form>
Elementy <fieldset> i <legend>
Elementy <select>, <option> i <optgroup>
Elem ent <textarea>
Elem ent <button>
Elem ent <label>
W nioski
5.
125
126
127
130
132
132
134
135
136
137
137
137
138
138
138
139
139
139
Elementy svg, canvas, audio i v i d e o ...............................................................141
M ultim edialne interfejsy API w HTML5
SVG
Dołączanie grafiki SVG do dokumentów
Technika Clown Car — SVG i dynamicznie dopasowywana grafika
pierw szego planu
Nauka SVG
Form at SVG w grze CubeeDoo
Elem ent canvas
Elem ent <canvas> a element <svg>
Elementy <audio> i <video>
Typy plików m ultimedialnych
Dodawanie elementu <video> do witryny
Atrybuty elementów <video> i <audio>
Elementy <video> i <audio> a JavaScript
Określanie stylu elementu <video>
141
141
143
144
145
146
148
152
154
154
155
155
159
161
6.
Inne interfejsy API z H T M L 5 ......................................................................... 165
Aplikacje internetowe działające w trybie offline
Czy urządzenie jest podłączone do sieci?
Pamięć podręczna aplikacji
Pamięć lokalna i pam ięć sesji
Pamięć oparta na SQL-u i bazach danych
165
165
166
170
179
6
|
Sp s treśc
Zgłoś jeśli naruszono regulamin