HTML5页面开发的基础性模板

HTML5页面开发的基础性模板,包含了两个版本:

  • 开发版本
  • 注释版本

开发版本

 
 
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  5. <meta charset="utf-8">
  6. <title></title>
  7. <meta name="description" content="">
  8. <meta name="author" content="">
  9. <meta name="viewport" content="width=device-width, initial-scale=1">
  10. <link rel="stylesheet" href="">
  11. <!--[if lt IE 9]>
  12. <script src="//cdn.jsdelivr.net/html5shiv/3.7.2/html5shiv.min.js"></script>
  13. <script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js"></script>
  14. <![endif]-->
  15. <link rel="shortcut icon" href="">
  16. </head>
  17. <body>
  18.  
  19. <!-- 这里添加页面主要内容 -->
  20.  
  21. <!-- SCRIPTS:个人建议在天朝不要使用Google的CDN了,是不是你就发现你的网站功能失效了 -->
  22. <!-- Example: <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> -->
  23. </body>
  24. </html>

注释版本

 
 
  1. <!DOCTYPE html>
  2. <!--
  3. 设置lang值来保证<html>标签的互操作性及其可访问性
  4.   更多HTML标签全局性属性
  5.   请阅读这里: http://www.w3.org/TR/html-markup/global-attributes.html -->
  6. <html>
  7.  
  8. <head>
  9.  
  10. <!--
  11. 告诉IE使用目前最新的布局引擎:
  12.  更多信息阅读这里: https://www.modern.ie/en-us/performance/how-to-use-x-ua-compatible -->
  13. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  14.  
  15. <!--
  16. 针对web性能定义字符集,首选通过HTTP header来设置
  17.   确保HTTP header和Meta标签设置一致
  18.   更多信息阅读这里: https://developers.google.com/speed/docs/best-practices/rendering#SpecifyCharsetEarly -->
  19. <meta charset="utf-8">
  20.  
  21. <!-- 指定页面标题 -->
  22. <title></title>
  23.  
  24. <!-- 指定web页面描述 -->
  25. <meta name="description" content="">
  26.  
  27. <!-- 指定web页面作者 -->
  28. <meta name="author" content="">
  29.  
  30. <!-- 提示移动浏览器使用设备宽度和缩放比 -->
  31. <meta name="viewport" content="width=device-width, initial-scale=1">
  32.  
  33. <!-- 在页面加载前来加载CSS
  34. 保证相关样式的及时加载
  35. 指定对应的URI属性 -->
  36. <link rel="stylesheet" href="">
  37.  
  38. <!--
  39. 加载htmlshiv和respond.js来兼容老版本的IE浏览器
  40.   方便使用HTML5中的新元素和media queries -->
  41. <!--[if lt IE 9]>
  42. <script src="//cdn.jsdelivr.net/html5shiv/3.7.2/html5shiv.min.js"></script>
  43. <script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js"></script>
  44. <![endif]-->
  45.  
  46. <!-- 指定favicon的URI -->
  47. <link rel="shortcut icon" href="">
  48.  
  49. <!-- 下面注释掉的是ios/android书签图标-->
  50. <!--
  51. <meta name="mobile-web-app-capable" content="yes">
  52. <link rel="icon" sizes="196x196" href="">
  53. <link rel="apple-touch-icon" sizes="152x152" href="">
  54. -->
  55.  
  56. <!--
  57. 如果可能使用async属性来非阻断的加载脚本
  58.   例子: <script src="" async></script> -->
  59. </head>
  60. <body>
  61.  
  62. <!-- 这里添加页面主要内容 -->
  63.  
  64. <!-- 如果可能使用async属性来非阻断的加载脚本 -->
  65. <!-- SCRIPTS -->
  66. <!-- 例子: <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> -->
  67. </body>
  68. </html>
http://www.gbtags.com/gb/share/3571.htm
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值