![Web fonts @font-face
2D in 3D
transformacije
translate(), scale(), rotate(), skew()
translate3d(), scale3d(), rotate3d(), perspective, matrix3d()
Media queries @media ... { ... }
Veplastna ozadja in
prelivi
background: url(), url(), url(), ...
linear-gradient(), radial-gradient(), ...
HSLA in RGBA barve
color: hsla(0-255, 0-255, 0-255, 0-1)
color: rgba(0-255, 0-255, 0-255, 0-1)
Zaobljeni robovi in
sence
box-shadow, text-shadow, border-radius
Selektorji
[attr^=val], [attr$=val], [attr*=val], :nth-child(), :nth-last-
child(), :nth-of-type(), :last-child, :first-of-type(), :empty,
:target, :enabled, :disabled, :not(), E~F, ...](https://image.slidesharecdn.com/html5incss3vpraksi-web-101029053938-phpapp02/85/HTML5-in-CSS3-v-praksi-18-320.jpg)
![(function() {
var e = "section,article,header,footer".split(",");
for(var i = 0; i < e.length; i++) {
document.createElement(e[i]);
}
})();](https://image.slidesharecdn.com/html5incss3vpraksi-web-101029053938-phpapp02/85/HTML5-in-CSS3-v-praksi-27-320.jpg)
HTML5 in CSS3 v praksi
- 10. IE 5 IE 6 Mozilla / Netscape Opera Ostali
- 11. IE 6 IE 7 IE 8 IE 9 Firefox Chrome Safari Opera Ostali
- 17. Poenostavljen DOCTYPE <!DOCTYPE html> Semantika <article>, <section>, <header>, <footer>, <nav>, <aside>, <figure>, <figcaption>, <mark>, <summary> Obrazci type="search|number|range|color|tel|url|email,...", client-side validacija, autofocus, placeholder Multimedia <audio>, <video>, Audio & Video API Grafika SVG, Canvas, WebGL
- 18. Web fonts @font-face 2D in 3D transformacije translate(), scale(), rotate(), skew() translate3d(), scale3d(), rotate3d(), perspective, matrix3d() Media queries @media ... { ... } Veplastna ozadja in prelivi background: url(), url(), url(), ... linear-gradient(), radial-gradient(), ... HSLA in RGBA barve color: hsla(0-255, 0-255, 0-255, 0-1) color: rgba(0-255, 0-255, 0-255, 0-1) Zaobljeni robovi in sence box-shadow, text-shadow, border-radius Selektorji [attr^=val], [attr$=val], [attr*=val], :nth-child(), :nth-last- child(), :nth-of-type(), :last-child, :first-of-type(), :empty, :target, :enabled, :disabled, :not(), E~F, ...
- 19. Geolokacija getCurrentPosition(), watchPosition(), GUI Offline <html manifest="">, Caching API, Events Web Workers window.Worker Web Sockets window.WebSocket X-doc messaging window.postMessage() Web Storage window.localStorage Web SQL window.openDatabase() History API window.history ContentEditable .isContentEditable() Drag-and-drop .draggable
- 27. (function() { var e = "section,article,header,footer".split(","); for(var i = 0; i < e.length; i++) { document.createElement(e[i]); } })();
- 29. Uporaba dodatenga class="..." atributa v kombinaciji z JS zaznavo (za IE).
- 30. <audio> <!-- Flash ali Silverlight fallback --> </audio> Uporabi eno izmed Javascript knji転nic za alternativno implementacijo.* * npr. http://mediaelementjs.com/; uporablja Flash ali Silverlight kot nadomestek. Dostop do audio API: dynamicaudio.js
- 38. Uporaba ene izmed Javascript knji転nic za emulacijo tranzicij in animacij.* * Scripting CSS3 properties, CSS Sandpaper, Transformie
- 40. * ...e izvzamemo IE < 9. e uporabljamo samo 2 plasti, lahko uporabimo filter CSS atribut. Za ve ozadij potrebujemo ve gnezdenih HTML elementov (velja tudi za druge, starej邸e brskalnike).
- 41. Za barvo ozadja lahko uporabimo filter CSS atribut; za barvo teksta pa ni re邸itve.