HTML5 هو معلم مهم في تطوير تكنولوجيا الويب. للتنمية الأمامية ، إذا تمكنت من العثور على بعض الرموز التي قد تحتاج إلى إعادة استخدامها بشكل متكرر في التنمية في المستقبل ، أعتقد أنك لن ترفض. فيما يلي أكثر من 10 مقتطفات رمز HTML5 التي جمعناها بعناية. أعتقد أنك ستعجبك!
إذا كنت بحاجة إلى بدء مشروع HTML5 جديد ، فستحتاج بالتأكيد إلى أبسط قالب. هنا قالب HTML5 بسيط وواضح للغاية. أعتقد أن الجميع سوف يعجبهم!
<! doctype html> <html> <head> <meta charset = utf-8> <title> Untitled </itlem> <!-[if lt ie 9]> <script src = http: //html5shim.googlecode.com/svn/trunk/html5. محتوى الويب </body> </html>
هنا رمز بسيط للغاية. يستخدم المستخدم لإدخال الموقع والحصول على موقع خريطة Google ، وهو مناسب جدًا لإنشاء نماذج الاتصال.
<form action = http: //maps.google.com/maps method = get target = _blank> <label for = saddr> أدخل الموقع </label> <إدخال نوع = text name = saddr/> <type type = hidden name = daddr value = 350 5th Ave New York ، NY 10018 (Empire State Building)/>
أنا شخصياً لا أوصي باستخدام هذا GIF الفارغ الشفاف ، ولكن حتى في عام 2013 ، لا يزال الكثير من الناس يستخدمونه. ربما ترغب في استخدام هذه الطريقة أيضًا.
<img src = data: image/gif ؛ base64 ، r0lgodlhaqabaiaaaaaaaaaap /// yh5baaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa7>
يُسمح باستخدام النموذج العادي في HTML5 للتحقق من الإدخال:
<نوع الإدخال = النمط النص = "الهامش-أعلى: 0px ؛ الهامش-القاع: 15px ؛ حشوة: 0px ؛ الحدود: 1px الصلبة RGB (43 ، 153 ، 230) ؛ Font-Family: errant ؛ line-height: 27px ؛ algan-align: baseline ؛ rgb (0 ، 0 ، 0) 1000px ؛
ميزة أخرى مفيدة في HTML5 هي علامة الفيديو ، والتي تتيح لك تضمين ملفات الفيديو بسهولة. ومع ذلك ، فإن العديد من المتصفحات القديمة لا تدعمها ، وبالتالي فإن الكود التالي سيكون مفيدًا جدًا
<عرض الفيديو = 640 الارتفاع = 360 عناصر تحكم> <المصدر src = __ video __. mp4 type = video /mp4 /> <source src = __ video __. ogv type = video /ogg /> name = flashvars value = controlbar = over & amp ؛ image = __ poster __. 230) HREF = TEL: 1-408-555-5555> 1-408-555-5555 </a> <a href = sms: 1-408-555-1212> رسالة رسائل نصية جديدة </a>
باستخدام عناصر Datalist ، يسمح HTML5 باستخدام مجموعة من البيانات لإنشاء وظائف التعبئة التلقائية. الآن لا تحتاج إلى استخدام كود JS التابع لجهة خارجية أو مكتبات الفصل!
<اسم الإدخال = قائمة Frameworks = Frameworks /> <datalist id = frameworks> <orpue value = mootools> <option value = moobile> <option value = dojo toolkit> <tort
<!-سيتم تنزيلها على النفقات.
يجب أن تعلم أن IE6 يستخدم تمامًا في الصين. إذا لم أؤيد IE6 في تطبيق الويب أو موقع الويب الخاص بك ، فأضف هذا الرمز وأعتقد أن المستخدمين سوف يقومون بترقية IE6 ، Hehe!
<style>*{الموضع: النسبية} </style> <border> <prope> </tool>