HTML5 est une étape importante dans le développement de la technologie Web. Pour le développement frontal, si vous pouvez trouver des codes qui peuvent devoir être réutilisés fréquemment dans le développement à l'avenir, je pense que vous ne refuseras pas. Vous trouverez ci-dessous plus de 10 extraits de code HTML5 que nous avons soigneusement collectés. Je crois que vous l'aimerez!
Si vous devez démarrer un nouveau projet HTML5, vous aurez certainement besoin du modèle le plus simple. Voici un modèle HTML5 très simple et clair. Je crois que tout le monde l'aimera!
<! Doctype html> <html> <éadf> <meta charset = utf-8> <tight> Untitled </ title> <! - [if lt ie 9]> <script src = http: //html5shim.googlecode.com/svn/trunk/html5 le web </body> </html>
Voici un code très simple. Il utilise l'utilisateur pour saisir l'emplacement et obtenir l'emplacement de Google Map, qui est très adapté pour générer des formulaires de contact.
<form action = http: //maps.google.com/maps method = get target = _blank> <label for = saddr> Entrez emplacement </ labe> <input type = text name = saddr /> <input type = Hidden Name = daddr value = 350 5th Ave New York, ny 10018 (Empire State Build
Personnellement, je ne recommande pas d'utiliser ce gif vierge transparent, mais même en 2013, de nombreuses personnes l'utilisent toujours. Vous aimez peut-être aussi utiliser cette méthode.
<img src = data: image / gif; base64, r0lgodlhaqabaiaaaaaaaaaap /// yh5baaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa7>
Le formulaire régulier est autorisé à être utilisé dans HTML5 pour la vérification des entrées:
<input type=text style="margin-top: 0px; margin-bottom: 15px; padding: 0px; border: 1px solid rgb(43, 153, 230); font-family: inherit; line-height: 27px; vertical-align: baseline; color: rgb(0, 0, 0); background-color: rgb(245, 250, 255); width: 1000px; z-index: 1000; "> <objet type = application / x-shockwave-flash data = your-flash-file.swf width = 0 height = 0> <param name = film value = your-flash-file.swf /> <param name = qualité valeur = high /> </ objet>
Une autre fonctionnalité la plus utile de HTML5 est la balise vidéo, qui vous permet d'intégrer facilement des fichiers vidéo. Cependant, de nombreux anciens navigateurs ne le soutiennent pas, donc le code suivant sera très utile
<video width = 640 height = 360 commandes> <source src = __ vidéo __. MP4 type = vidéo / MP4 /> <source src = __ video __. Ogv type = vidéo / ogg /> <objet width = 640 height = 360 type = application / x-shockwave-flash data = __ flash __. Nom = FlashVars Value = ControlBar = Over & amp; image = __ Affiche __. JPG & amp; file = __ Video __. MP4 /> <img src = __ vidéo __. JPG Width = 640 Height = 360 Style = "margin-top: 0px; margin-bottom: 15px; plafonn 230); HREF = Tél: 1-408-555-5555> 1-408-555-5555 </a> <a href = sms: 1-408-555-1212> Nouveau message SMS </a>
En utilisant des éléments de données de données, HTML5 permet d'utiliser un ensemble de données pour générer des fonctions de remplissage automatique. Maintenant, vous n'avez pas besoin d'utiliser du code JS tiers ou des bibliothèques de classe!
<input name = frameworks list = frameworks /> <datalist id = frameworks> <option value = mootools> <option value = moobile> <option value = dojo toolkit> <option value = jQuery> <option value = yui> </ dataalist>
<! - Télécharger les dépenses.pdf -> <a href = / files / adlafjlxJewfasd89asd8f.pdf download = dépenses.pdf> Téléchargez votre rapport de dépenses </a>
Vous devez savoir que IE6 est assez utilisé en Chine. Si je ne prends pas en charge IE6 dans votre application Web ou votre site Web, ajoutez ce code et je crois que vos utilisateurs mettront à niveau IE6, hehe!
<style> * {position: relative} </pysty> <s table> <fort> </ table>