{"id":3220,"date":"2011-10-21T04:17:33","date_gmt":"2011-10-20T20:17:33","guid":{"rendered":"https:\/\/blog-staging.tenten.co\/blog\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/"},"modified":"2023-12-28T00:48:54","modified_gmt":"2023-12-27T16:48:54","slug":"html5-%e6%96%b0%e7%89%b9%e8%89%b2","status":"publish","type":"post","link":"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/","title":{"rendered":"28\u500b\u5fc5\u9808\u77e5\u9053\u7684 HTML5 \u65b0\u7279\u8272"},"content":{"rendered":"

\"\"<\/p>\n

\n

28\u500b\u5fc5\u9808\u77e5\u9053\u7684HTML5\u65b0\u7279\u6027<\/h2>\n

1. \u65b0\u7684Doctype \u76e1\u7ba1\u4f7f\u7528!DOCTYPE html\uff0c\u5373\u4f7f\u700f\u89bd\u5668\u4e0d\u61c2\u9019\u53e5\u8a71\u4e5f\u6703\u6309\u7167\u6a19\u51c6\u6a21\u5f0f\u53bb\u57f7\u884c Render \u9801\u9762
\n2. Figure\u5143\u7d20 \u7528figure\u548cfigcaption\u4f86\u8a9e\u7fa9\u5316\u5730\u8868\u793a\u5e36\u6a19\u984c\u7684\u5716\u7247 XML\/HTML Code \u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f figure img src\u2026<\/p>\n

<\/p>\n

\n

1. \u65b0\u7684Doctype<\/strong><\/p>\n

\u76e1\u7ba1\u4f7f\u7528<!DOCTYPE html>\uff0c\u5373\u4f7f\u700f\u89bd\u5668<\/span><\/a>\u4e0d\u61c2\u9019\u53e5\u8a71\u4e5f\u6703\u6309\u7167\u6a19\u51c6\u6a21\u5f0f\u53bb\u6e32\u67d3<\/p>\n

2. Figure\u5143\u7d20<\/strong><\/p>\n

\u7528<figure>\u548c<figcaption>\u4f86\u8a9e\u7fa9\u5316\u5730\u8868\u793a\u5e36\u6a19\u984c\u7684\u5716\u7247<\/p>\n

\n
XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
\n
    \n
  1. <<\/span>figure<\/span>><\/span> <\/span><\/span><\/li>\n
  2. <<\/span>img<\/span> <\/span>src<\/span>=\u201dpath\/to\/image\u201d <\/span>alt<\/span>=\u201dAbout image\u201d <\/span>\/><\/span> <\/span><\/span><\/li>\n
  3. <<\/span>figcaption<\/span>><\/span> <\/span><\/span><\/li>\n
  4. <<\/span>p<\/span>><\/span>This is an image of something interesting. <\/span><\/<\/span>p<\/span>><\/span> <\/span><\/span><\/li>\n
  5. <\/<\/span>figcaption<\/span>><\/span> <\/span><\/span><\/li>\n
  6. <\/<\/span>figure<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n

    3. \u91cd\u65b0\u5b9a\u7fa9\u7684<small><\/strong><\/p>\n

    <small>\u5df2\u7d93\u88ab\u91cd\u65b0\u5b9a\u7fa9\u4e86\uff0c\u73fe\u5728\u88ab\u7528\u4f86\u8868\u793a\u5c0f\u7684\u6392\u7248\uff0c\u5982\u7db2\u7ad9\u5e95\u90e8\u7684\u7248\u6b0a\u8072\u660e<\/p>\n

    4. \u53bb\u6389link\u548cscript\u6a19\u7c3d\u88e1\u9762\u7684type\u5c6c\u6027<\/strong><\/p>\n

    5. \u52a0\/\u4e0d\u52a0 \u62ec\u865f<\/strong><\/p>\n

    HTML5\u6c92\u6709\u56b4\u683c\u7684\u8981\u6c42\u5c6c\u6027\u5fc5\u9808\u52a0\u5f15\u865f\uff0c\u9589\u5408\u4e0d\u9589\u5408\uff0c\u4f46\u662f\u5efa\u8b70\u52a0\u4e0a\u5f15\u865f\u548c\u9589\u5408\u6a19\u7c3d<\/p>\n

    6. \u8b93\u4f60\u7684\u5167\u5bb9\u53ef\u7de8\u8f2f\uff0c\u53ea\u9700\u8981\u52a0\u4e00\u500bcontenteditable\u5c6c\u6027<\/strong><\/p>\n

    7. Email Inputs<\/strong><\/p>\n

    \u5982\u679c\u6211\u5011\u7d66Input\u7684type\u8a2d\u7f6e\u70baemail\uff0c\u700f\u89bd\u5668\u5c31\u6703\u9a57\u8b49\u9019\u500b\u8f38\u5165\u662f\u5426\u662femail\u985e\u578b\uff0c\u7576\u7136\u4e0d\u80fd\u53ea\u4f9d\u8cf4\u524d\u7aef\u7684\u6821\u9a57\uff0c\u5f8c\u7aef\u4e5f\u5f97\u6709\u76f8\u61c9\u7684\u6821\u9a57<\/p>\n

    8. Placeholders<\/strong><\/p>\n

    \u9019\u500binput\u5c6c\u6027\u7684\u610f\u7fa9\u5c31\u662f\u4e0d\u5fc5\u901a\u904ejavascript\u4f86\u505aplaceholder\u7684\u6548\u679c\u4e86<\/p>\n

    9. Local Storage<\/span><\/a><\/strong><\/p>\n

    \u4f7f\u7528Local Storage\u53ef\u4ee5\u6c38\u4e45\u5b58\u5132\u5927\u7684\u6578\u64da\u7247\u6bb5\u5728\u5ba2\u6236\u7aef\uff08\u9664\u975e\u4e3b\u52d5\u522a\u9664\uff09\uff0c\u76ee\u524d\u5927\u90e8\u5206\u700f\u89bd\u5668\u5df2\u7d93\u652f\u6301\uff0c\u5728\u4f7f\u7528\u4e4b\u524d\u53ef\u4ee5\u6aa2\u6e2c\u4e00\u4e0bwindow.localStorage\u662f\u5426\u5b58\u5728<\/p>\n

     <\/p>\n

    10. \u8a9e\u7fa9\u5316\u7684header\u548cfooter<\/strong><\/p>\n

    11. \u66f4\u591a\u7684HTML5\u8868\u55ae<\/span><\/a>\u7279\u6027<\/strong><\/p>\n

    12. IE\u548cHTML5<\/strong><\/p>\n

    \u9ed8\u8a8d\u7684\uff0cHTML5\u65b0\u5143\u7d20\u88ab\u4ee5inline\u7684\u65b9\u5f0f\u6e32\u67d3\uff0c\u4e0d\u904e\u53ef\u4ee5\u901a\u904e\u4e0b\u9762\u9019\u7a2e\u65b9\u5f0f\u8b93<\/p>\n

    \u5176\u4ee5block\u65b9\u5f0f\u6e32\u67d3<\/p>\n

    \n
    XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
    \n
      \n
    1. header, footer, article, section, nav, menu, hgroup { <\/span><\/span><\/li>\n
    2. display: block; <\/span><\/li>\n
    3. } <\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

      \u4e0d\u5e78\u7684\u662fIE\u6703\u5ffd\u7565\u9019\u4e9b\u6a23\u5f0f\uff0c\u53ef\u4ee5\u50cf\u4e0b\u9762\u9019\u6a23fix:<\/p>\n

      \n
      JavaScript Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
      \n
        \n
      1. document.createElement(\u201darticle\u201d); <\/span><\/span><\/li>\n
      2. document.createElement(\u201dfooter\u201d); <\/span><\/li>\n
      3. document.createElement(\u201dheader\u201d); <\/span><\/li>\n
      4. document.createElement(\u201dhgroup\u201d); <\/span><\/li>\n
      5. document.createElement(\u201dnav\u201d); <\/span><\/li>\n
      6. document.createElement(\u201dmenu\u201d); <\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

        13. hgroup<\/strong><\/p>\n

        \u4e00\u822c\u5728header\u88e1\u9762\u7528\u4f86\u5c07\u4e00\u7d44\u6a19\u984c\u7d44\u5408\u5728\u4e00\u8d77\uff0c\u5982<\/p>\n

        \n
        XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
        \n
          \n
        1. <<\/span>header<\/span>><\/span> <\/span><\/span><\/li>\n
        2. <<\/span>hgroup<\/span>><\/span> <\/span><\/span><\/li>\n
        3. <<\/span>h1<\/span>><\/span> Recall Fan Page <\/span><\/<\/span>h1<\/span>><\/span> <\/span><\/span><\/li>\n
        4. <<\/span>h2<\/span>><\/span> Only for people who want the memory of a lifetime. <\/span><\/<\/span>h2<\/span>><\/span> <\/span><\/span><\/li>\n
        5. <\/<\/span>hgroup<\/span>><\/span> <\/span><\/span><\/li>\n
        6. <\/<\/span>header<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

          14. Required\u5c6c\u6027<\/strong><\/p>\n

          required\u5c6c\u6027\u5b9a\u7fa9\u4e86\u4e00\u500binput\u662f\u5426\u662f\u5fc5\u9808\u7684\uff0c\u4f60\u53ef\u4ee5\u50cf\u4e0b\u9762\u9019\u6a23\u8072\u660e<\/p>\n

          \n
          XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
          \n
            \n
          1. <<\/span>input<\/span> <\/span>type<\/span>=\u201dtext\u201d <\/span>name<\/span>=\u201dsomeInput\u201d required<\/span>><\/span> <\/span><\/span><\/li>\n
          2. <!–\u6216\u8005–><\/span> <\/span><\/span><\/li>\n
          3. <<\/span>input<\/span> <\/span>type<\/span>=\u201dtext\u201d <\/span>name<\/span>=\u201dsomeInput\u201d <\/span>required<\/span>=\u201drequired\u201d<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

            15. Autofocus\u5c6c\u6027<\/strong><\/p>\n

            \u6b63\u5982\u5b83\u7684\u8a5e\u7fa9\uff0c\u5c31\u662f\u805a\u7126\u5230\u8f38\u5165\u6846\u88e1\u9762<\/p>\n

            \n
            XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
            \n
              \n
            1. <<\/span>input<\/span> <\/span>type<\/span>=\u201dtext\u201d <\/span>name<\/span>=\u201dsomeInput\u201d <\/span>placeholder<\/span>=\u201dDouglas Quaid\u201d required autofocus<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

              16. Audio\u652f\u6301<\/strong><\/p>\n

              HTML5\u63d0\u4f9b\u4e86<audio>\u6a19\u7c3d\uff0c\u4f60\u4e0d\u9700\u8981\u518d\u6309\u7167\u7b2c\u4e09\u65b9\u63d2\u4ef6\u4f86\u6e32\u67d3\u97f3\u983b\uff0c\u5927\u591a\u6578\u73fe\u4ee3\u700f\u89bd\u5668\u63d0\u4f9b\u4e86\u5c0d\u65bcHTML5 Audio\u7684\u652f\u6301\uff0c\u4e0d\u904e\u76ee\u524d\u4ecd\u820a\u9700\u8981\u63d0\u4f9b\u4e00\u4e9b\u517c\u5bb9\u8655\u7406\uff0c\u5982<\/p>\n

               <\/p>\n

              \n
              XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
              \n
                \n
              1. <<\/span>audio<\/span> <\/span>autoplay<\/span>=\u201dautoplay\u201d <\/span>controls<\/span>=\u201dcontrols\u201d<\/span>><\/span> <\/span><\/span><\/li>\n
              2. <<\/span>source<\/span> <\/span>src<\/span>=\u201dfile.ogg\u201d <\/span>\/><\/span><!\u2013FF\u2013<\/span>><\/span> <\/span><\/span><\/li>\n
              3. <<\/span>source<\/span> <\/span>src<\/span>=\u201dfile.mp3\u301e <\/span>\/><\/span><!\u2013Webkit\u2013<\/span>><\/span> <\/span><\/span><\/li>\n
              4. <<\/span>a<\/span> <\/span>href<\/span>=\u201dfile.mp3\u301e<\/span>><\/span>Download this file.<\/span><\/<\/span>a<\/span>><\/span> <\/span><\/span><\/li>\n
              5. <\/<\/span>audio<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

                17. Video\u652f\u6301<\/strong><\/p>\n

                \u548cAudio\u5f88\u50cf\uff0c<video>\u6a19\u7c3d\u63d0\u4f9b\u4e86\u5c0d\u65bcvideo\u7684\u652f\u6301\uff0c\u7531\u65bcHTML5\u6587\u6a94\u4e26\u6c92\u6709\u7d66video\u6307\u5b9a\u4e00\u500b\u7279\u5b9a\u7684\u7de8\u78bc\uff0c\u6240\u4ee5\u700f \u89bd\u5668\u53bb\u6c7a\u5b9a\u8981\u652f\u6301\u54ea\u4e9b\u7de8\u78bc\uff0c\u5c0e\u81f4\u4e86\u5f88\u591a\u4e0d\u4e00\u81f4\u3002Safari\u548cIE\u652f\u6301H.264\u7de8\u78bc\u7684\u683c\u5f0f\uff0cFirefox\u548cOpera\u652f\u6301Theora\u548cVorbis \u7de8\u78bc\u7684\u683c\u5f0f\uff0c\u7576\u4f7f\u7528HTML5 video\u7684\u6642\u5019\uff0c\u4f60\u5fc5\u9808\u90fd\u63d0\u4f9b\uff1a<\/p>\n

                \n
                XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
                \n
                  \n
                1. <<\/span>video<\/span> controls preload<\/span>><\/span> <\/span><\/span><\/li>\n
                2. <<\/span>source<\/span> <\/span>src<\/span>=\u201dcohagenPhoneCall.ogv\u201d <\/span>type<\/span>=\u201dvideo\/ogg; <\/span>codecs<\/span>=\u2019vorbis, theora\u2019\u201d <\/span>\/><\/span> <\/span><\/span><\/li>\n
                3. <<\/span>source<\/span> <\/span>src<\/span>=\u201dcohagenPhoneCall.mp4\u301e <\/span>type<\/span>=\u201dvideo\/mp4; \u2019<\/span>codecs<\/span>=\u2019avc1.42E01E, mp4a.40.2\u2032\u201d <\/span>\/><\/span> <\/span><\/span><\/li>\n
                4. <<\/span>p<\/span>><\/span> Your browser is old. <\/span><<\/span>a<\/span> <\/span>href<\/span>=\u201dcohagenPhoneCall.mp4\u301e<\/span>><\/span>Download this video instead.<\/span><\/<\/span>a<\/span>><\/span> <\/span><\/<\/span>p<\/span>><\/span> <\/span><\/span><\/li>\n
                5. <\/<\/span>video<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

                  18. \u9810\u52a0\u8f09\u8996\u983b<\/strong><\/p>\n

                  preload\u5c6c\u6027\u5c31\u50cf\u5b83\u7684\u5b57\u9762\u610f\u601d\u90a3\u9ebc\u7c21\u55ae\uff0c\u4f60\u9700\u8981\u6c7a\u5b9a\u662f\u5426\u9700\u8981\u5728\u9801\u9762\u52a0\u8f09\u7684\u6642\u5019\u53bb\u9810\u52a0\u8f09\u8996\u983b<\/p>\n

                  \n
                  XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
                  \n
                    \n
                  1. <<\/span>video<\/span> preload<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

                    19. \u986f\u793a\u8996\u983b\u63a7\u5236<\/strong><\/p>\n

                    \n
                    XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
                    \n
                      \n
                    1. <<\/span>video<\/span> preload controls<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

                      20. \u6b63\u5247\u8868\u9054\u5f0f<\/strong><\/p>\n

                      \u7531\u65bcpattern\u5c6c\u6027\uff0c\u6211\u5011\u53ef\u4ee5\u5728\u4f60\u7684markup\u88e1\u9762\u76f4\u63a5\u4f7f\u7528\u6b63\u5247\u8868\u9054\u5f0f\u4e86<\/p>\n

                      \n
                      XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
                      \n
                        \n
                      1. <<\/span>form<\/span> <\/span>action<\/span>=\u201d” <\/span>method<\/span>=\u201dpost\u201d<\/span>><\/span> <\/span><\/span><\/li>\n
                      2. <<\/span>label<\/span> <\/span>for<\/span>=\u201dusername\u201d<\/span>><\/span>Create a Username: <\/span><\/<\/span>label<\/span>><\/span> <\/span><\/span><\/li>\n
                      3. <<\/span>input<\/span> <\/span>type<\/span>=\u201dtext\u201d <\/span>name<\/span>=\u201dusername\u201d <\/span>id<\/span>=\u201dusername\u201d <\/span>placeholder<\/span>=\u201d4 <\/span><<\/span>><\/span> 10\u301e <\/span>pattern<\/span>=\u201d[A-Za-z]{4,10}\u201d autofocus required<\/span>><\/span> <\/span><\/span><\/li>\n
                      4. <<\/span>button<\/span> <\/span>type<\/span>=\u201dsubmit\u201d<\/span>><\/span>Go <\/span><\/<\/span>button<\/span>><\/span> <\/span><\/span><\/li>\n
                      5. <\/<\/span>form<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

                        21. \u6aa2\u6e2c\u5c6c\u6027\u652f\u6301<\/strong><\/p>\n

                        \u9664\u4e86Modernizr\u4e4b\u5916\u6211\u5011\u9084\u53ef\u4ee5\u901a\u904ejavascript\u7c21\u55ae\u5730\u6aa2\u6e2c\u4e00\u4e9b\u5c6c\u6027\u662f\u5426\u652f\u6301\uff0c\u5982\uff1a<\/p>\n

                        \n
                        JavaScript Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
                        \n
                          \n
                        1. <script> <\/span><\/span><\/li>\n
                        2. if<\/span> (!\u2019pattern\u2019 <\/span>in<\/span> document.createElement(\u2019input\u2019) ) { <\/span><\/span><\/li>\n
                        3. \/\/ do client\/server side validation<\/span> <\/span><\/span><\/li>\n
                        4. } <\/span><\/li>\n
                        5. <\/script> <\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

                          22. Mark\u5143\u7d20<\/strong><\/p>\n

                          \u628a<mark>\u5143\u7d20\u770b\u505a\u662f\u9ad8\u4eae\u7684\u4f5c\u7528\uff0c\u7576\u6211\u9078\u64c7\u4e00\u6bb5\u6587\u5b57\u7684\u6642\u5019\uff0cjavascript\u5c0d\u65bcHTML\u7684markup\u6548\u679c\u61c9\u8a72\u662f\u9019\u6a23\u7684\uff1a<\/p>\n

                          \n
                          XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
                          \n
                            \n
                          1. <<\/span>h3<\/span>><\/span> Search Results <\/span><\/<\/span>h3<\/span>><\/span> <\/span><\/span><\/li>\n
                          2. <<\/span>p<\/span>><\/span> They were interrupted, just after Quato said, <\/span><<\/span>mark<\/span>><\/span>\u201dOpen your Mind\u201d<\/span><\/<\/span>mark<\/span>><\/span>. <\/span><\/<\/span>p<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

                            23. \u4ec0\u9ebc\u6642\u5019\u7528<div><\/strong><\/p>\n

                            HTML5\u5df2\u7d93\u5f15\u5165\u4e86\u9019\u9ebc\u591a\u5143\u7d20\uff0c\u90a3\u9ebcdiv\u6211\u5011\u9084\u8981\u7528\u55ce\uff1fdiv\u4f60\u53ef\u4ee5\u5728\u6c92\u6709\u66f4\u597d\u7684\u5143\u7d20\u7684\u6642\u5019\u53bb\u7528\u3002<\/p>\n

                            24. \u60f3\u7acb\u5373\u4f7f\u7528HTML5?<\/strong><\/p>\n

                            \u4e0d\u8981\u7b492022\u4e86\uff0c\u73fe\u5728\u5c31\u53ef\u4ee5\u4f7f\u7528\u4e86\uff0cjust do it.<\/p>\n

                            25. \u54ea\u4e9b\u4e0d\u662fHTML5<\/strong><\/p>\n

                            1)SVG<\/p>\n

                            2)CSS3<\/p>\n

                            3)Geolocation<\/span><\/a><\/p>\n

                            4)Client Storage<\/p>\n

                            5)Web Sockets<\/p>\n

                            26. Data\u5c6c\u6027<\/strong><\/p>\n

                            \n
                            XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
                            \n
                              \n
                            1. <<\/span>div<\/span> <\/span>id<\/span>=\u201dmyDiv\u201d <\/span>data-custom-attr<\/span>=\u201dMy Value\u201d<\/span>><\/span> Bla Bla <\/span><\/<\/span>div<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

                              CSS\u4e2d\u4f7f\u7528\uff1a<\/p>\n

                              \n
                              XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
                              \n
                                \n
                              1. <<\/span>style<\/span>><\/span> <\/span><\/span><\/li>\n
                              2. h1:hover:after { <\/span><\/li>\n
                              3. content: attr(data-hover-response); <\/span><\/li>\n
                              4. color: black; <\/span><\/li>\n
                              5. position: absolute; <\/span><\/li>\n
                              6. left: 0; <\/span><\/li>\n
                              7. } <\/span><\/li>\n
                              8. <\/<\/span>style<\/span>><\/span> <\/span><\/span><\/li>\n
                              9. <<\/span>h1<\/span> <\/span>data-hover-response<\/span>=\u201dI Said Don\u2019t Touch Me!\u201d<\/span>><\/span> Don\u2019t Touch Me <\/span><\/<\/span>h1<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n

                                27. Output\u5143\u7d20<\/strong><\/p>\n

                                <output>\u5143\u7d20\u7528\u4f86\u986f\u793a\u8a08\u7b97\u7d50\u679c\uff0c\u4e5f\u6709\u4e00\u500b\u548clabel\u4e00\u6a23\u7684for\u5c6c\u6027<\/p>\n

                                28. \u7528Range Input\u4f86\u5275\u5efa\u6ed1\u584a<\/strong><\/p>\n

                                HTML5\u5f15\u7528\u7684range\u985e\u578b\u53ef\u4ee5\u5275\u5efa\u6ed1\u584a\uff0c\u5b83\u63a5\u53d7min, max, step\u548cvalue\u5c6c\u6027<\/p>\n

                                \u53ef\u4ee5\u4f7f\u7528css\u7684:before\u548c:after\u4f86\u986f\u793amin\u548cmax\u7684\u503c<\/p>\n

                                \n
                                XML\/HTML Code<\/span>\u8907\u88fd\u5167\u5bb9\u5230\u526a\u8cbc\u677f<\/span><\/div>\n
                                \n
                                  \n
                                1. <<\/span>input<\/span> <\/span>type<\/span>=\u201drange\u201d <\/span>name<\/span>=\u201drange\u201d <\/span>min<\/span>=\u201d0\u301e <\/span>max<\/span>=\u201d10\u301e <\/span>step<\/span>=\u201d1\u301e <\/span>value<\/span>=\u201d”<\/span>><\/span> <\/span><\/span><\/li>\n
                                2. <<\/span>style<\/span>><\/span> <\/span><\/span><\/li>\n
                                3. input[type<\/span>=<\/span>range<\/span>]:before { content: attr(min); padding-right: 5px; <\/span><\/span><\/li>\n
                                4. } <\/span><\/li>\n
                                5. input[type<\/span>=<\/span>range<\/span>]:after { content: attr(max); padding-left: 5px;} <\/span><\/span><\/li>\n
                                6. <\/<\/span>style<\/span>><\/span> <\/span><\/span><\/li>\n<\/ol>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"28 \u500b HTML5 \u7684\u65b0\u7279\u6027\u5e6b\u52a9\u4f60\u4e86\u89e3 HTML5 \u5c07\u6703\u66ff\u672a\u4f86\u7684\u7db2\u7ad9\u958b\u767c\u5e36\u4f86\u600e\u6a23\u7684\u512a\u52e2","protected":false},"author":1,"featured_media":3224,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"csco_display_header_overlay":false,"csco_singular_sidebar":"","csco_page_header_type":"","footnotes":""},"categories":[306,296],"tags":[],"ppma_author":[533],"class_list":["post-3220","post","type-post","status-publish","format-standard","has-post-thumbnail","category-html5","category-tech","cs-entry"],"yoast_head":"\n28\u500b\u5fc5\u9808\u77e5\u9053\u7684 HTML5 \u65b0\u7279\u8272 - Tenten Blog<\/title>\n<meta name=\"description\" content=\"28 \u500b HTML5 \u7684\u65b0\u7279\u6027\u5e6b\u52a9\u4f60\u4e86\u89e3 HTML5 \u5c07\u6703\u66ff\u672a\u4f86\u7684\u7db2\u7ad9\u958b\u767c\u5e36\u4f86\u600e\u6a23\u7684\u512a\u52e2\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/tenten.co\/blog\/tech\/html5-\u65b0\u7279\u8272\/\" \/>\n<meta property=\"og:locale\" content=\"zh_TW\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"28\u500b\u5fc5\u9808\u77e5\u9053\u7684 HTML5 \u65b0\u7279\u8272 - Tenten Blog\" \/>\n<meta property=\"og:description\" content=\"28 \u500b HTML5 \u7684\u65b0\u7279\u6027\u5e6b\u52a9\u4f60\u4e86\u89e3 HTML5 \u5c07\u6703\u66ff\u672a\u4f86\u7684\u7db2\u7ad9\u958b\u767c\u5e36\u4f86\u600e\u6a23\u7684\u512a\u52e2\" \/>\n<meta property=\"og:url\" content=\"https:\/\/tenten.co\/blog\/tech\/html5-\u65b0\u7279\u8272\/\" \/>\n<meta property=\"og:site_name\" content=\"Tenten Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/tentencreative\/\" \/>\n<meta property=\"article:published_time\" content=\"2011-10-20T20:17:33+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-12-27T16:48:54+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/s5.tenten.co\/2023\/12\/html5_u_must_know.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"250\" \/>\n\t<meta property=\"og:image:height\" content=\"250\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Nancy P\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@https:\/\/twitter.com\/tentencreative\" \/>\n<meta name=\"twitter:site\" content=\"@tentencreative\" \/>\n<meta name=\"twitter:label1\" content=\"\u4f5c\u8005:\" \/>\n\t<meta name=\"twitter:data1\" content=\"Nancy P\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u9810\u4f30\u95b1\u8b80\u6642\u9593\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 \u5206\u9418\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/\"},\"author\":{\"name\":\"Nancy P\",\"@id\":\"https:\/\/tenten.co\/blog\/#\/schema\/person\/b8f2cfaa5cdbcc9a9be32ad46da81aba\"},\"headline\":\"28\u500b\u5fc5\u9808\u77e5\u9053\u7684 HTML5 \u65b0\u7279\u8272\",\"datePublished\":\"2011-10-20T20:17:33+00:00\",\"dateModified\":\"2023-12-27T16:48:54+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/\"},\"wordCount\":606,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/tenten.co\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/s5.tenten.co\/2023\/12\/html5_u_must_know.jpg\",\"articleSection\":[\"HTML5\",\"Tech\"],\"inLanguage\":\"zh-TW\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/\",\"url\":\"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/\",\"name\":\"28\u500b\u5fc5\u9808\u77e5\u9053\u7684 HTML5 \u65b0\u7279\u8272 - Tenten Blog\",\"isPartOf\":{\"@id\":\"https:\/\/tenten.co\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/s5.tenten.co\/2023\/12\/html5_u_must_know.jpg\",\"datePublished\":\"2011-10-20T20:17:33+00:00\",\"dateModified\":\"2023-12-27T16:48:54+00:00\",\"description\":\"28 \u500b HTML5 \u7684\u65b0\u7279\u6027\u5e6b\u52a9\u4f60\u4e86\u89e3 HTML5 \u5c07\u6703\u66ff\u672a\u4f86\u7684\u7db2\u7ad9\u958b\u767c\u5e36\u4f86\u600e\u6a23\u7684\u512a\u52e2\",\"breadcrumb\":{\"@id\":\"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#breadcrumb\"},\"inLanguage\":\"zh-TW\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-TW\",\"@id\":\"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#primaryimage\",\"url\":\"https:\/\/s5.tenten.co\/2023\/12\/html5_u_must_know.jpg\",\"contentUrl\":\"https:\/\/s5.tenten.co\/2023\/12\/html5_u_must_know.jpg\",\"width\":250,\"height\":250},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/tenten.co\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"28\u500b\u5fc5\u9808\u77e5\u9053\u7684 HTML5 \u65b0\u7279\u8272\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/tenten.co\/blog\/#website\",\"url\":\"https:\/\/tenten.co\/blog\/\",\"name\":\"AI SEO by Tenten - AI-Powered SEO + Technical SEO\",\"description\":\"Shopify Plus\u3001Webflow \u8a8d\u8b49\u5c08\u5bb6\uff01Tenten \u5e6b\u4f60\u5feb\u901f\u5efa\u7f6e\u5c08\u696d\u7db2\u7ad9\",\"publisher\":{\"@id\":\"https:\/\/tenten.co\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/tenten.co\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"zh-TW\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/tenten.co\/blog\/#organization\",\"name\":\"AI SEO by Tenten - AI-Powered SEO + Technical SEO\",\"url\":\"https:\/\/tenten.co\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-TW\",\"@id\":\"https:\/\/tenten.co\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/s5.tenten.co\/2023\/12\/site-icon.png\",\"contentUrl\":\"https:\/\/s5.tenten.co\/2023\/12\/site-icon.png\",\"width\":512,\"height\":512,\"caption\":\"AI SEO by Tenten - AI-Powered SEO + Technical SEO\"},\"image\":{\"@id\":\"https:\/\/tenten.co\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/tentencreative\/\",\"https:\/\/x.com\/tentencreative\",\"https:\/\/www.linkedin.com\/company\/tentenco\",\"https:\/\/www.instagram.com\/tenten.co\",\"https:\/\/www.youtube.com\/user\/tentencreative\",\"https:\/\/dribbble.com\/tentenco\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/tenten.co\/blog\/#\/schema\/person\/b8f2cfaa5cdbcc9a9be32ad46da81aba\",\"name\":\"Nancy P\",\"description\":\"Experienced Stock Market Researcher and Financial Advisor with a passion for analyzing market trends and helping clients make informed investment decisions. Combining in-depth market knowledge with personalized financial planning to deliver tailored solutions for individuals and businesses.\",\"sameAs\":[\"https:\/\/tenten.co\",\"https:\/\/instagram.com\/tenten.co\",\"https:\/\/www.linkedin.com\/in\/pladoramaria\/\",\"https:\/\/x.com\/https:\/\/twitter.com\/tentencreative\",\"https:\/\/www.youtube.com\/@tentencreative\",\"https:\/\/twitter.com\/erikthought\"],\"url\":\"https:\/\/tenten.co\/blog\/author\/tenten\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"28\u500b\u5fc5\u9808\u77e5\u9053\u7684 HTML5 \u65b0\u7279\u8272 - Tenten Blog","description":"28 \u500b HTML5 \u7684\u65b0\u7279\u6027\u5e6b\u52a9\u4f60\u4e86\u89e3 HTML5 \u5c07\u6703\u66ff\u672a\u4f86\u7684\u7db2\u7ad9\u958b\u767c\u5e36\u4f86\u600e\u6a23\u7684\u512a\u52e2","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/tenten.co\/blog\/tech\/html5-\u65b0\u7279\u8272\/","og_locale":"zh_TW","og_type":"article","og_title":"28\u500b\u5fc5\u9808\u77e5\u9053\u7684 HTML5 \u65b0\u7279\u8272 - Tenten Blog","og_description":"28 \u500b HTML5 \u7684\u65b0\u7279\u6027\u5e6b\u52a9\u4f60\u4e86\u89e3 HTML5 \u5c07\u6703\u66ff\u672a\u4f86\u7684\u7db2\u7ad9\u958b\u767c\u5e36\u4f86\u600e\u6a23\u7684\u512a\u52e2","og_url":"https:\/\/tenten.co\/blog\/tech\/html5-\u65b0\u7279\u8272\/","og_site_name":"Tenten Blog","article_publisher":"https:\/\/www.facebook.com\/tentencreative\/","article_published_time":"2011-10-20T20:17:33+00:00","article_modified_time":"2023-12-27T16:48:54+00:00","og_image":[{"width":250,"height":250,"url":"https:\/\/s5.tenten.co\/2023\/12\/html5_u_must_know.jpg","type":"image\/jpeg"}],"author":"Nancy P","twitter_card":"summary_large_image","twitter_creator":"@https:\/\/twitter.com\/tentencreative","twitter_site":"@tentencreative","twitter_misc":{"\u4f5c\u8005:":"Nancy P","\u9810\u4f30\u95b1\u8b80\u6642\u9593":"3 \u5206\u9418"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#article","isPartOf":{"@id":"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/"},"author":{"name":"Nancy P","@id":"https:\/\/tenten.co\/blog\/#\/schema\/person\/b8f2cfaa5cdbcc9a9be32ad46da81aba"},"headline":"28\u500b\u5fc5\u9808\u77e5\u9053\u7684 HTML5 \u65b0\u7279\u8272","datePublished":"2011-10-20T20:17:33+00:00","dateModified":"2023-12-27T16:48:54+00:00","mainEntityOfPage":{"@id":"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/"},"wordCount":606,"commentCount":0,"publisher":{"@id":"https:\/\/tenten.co\/blog\/#organization"},"image":{"@id":"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#primaryimage"},"thumbnailUrl":"https:\/\/s5.tenten.co\/2023\/12\/html5_u_must_know.jpg","articleSection":["HTML5","Tech"],"inLanguage":"zh-TW"},{"@type":"WebPage","@id":"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/","url":"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/","name":"28\u500b\u5fc5\u9808\u77e5\u9053\u7684 HTML5 \u65b0\u7279\u8272 - Tenten Blog","isPartOf":{"@id":"https:\/\/tenten.co\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#primaryimage"},"image":{"@id":"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#primaryimage"},"thumbnailUrl":"https:\/\/s5.tenten.co\/2023\/12\/html5_u_must_know.jpg","datePublished":"2011-10-20T20:17:33+00:00","dateModified":"2023-12-27T16:48:54+00:00","description":"28 \u500b HTML5 \u7684\u65b0\u7279\u6027\u5e6b\u52a9\u4f60\u4e86\u89e3 HTML5 \u5c07\u6703\u66ff\u672a\u4f86\u7684\u7db2\u7ad9\u958b\u767c\u5e36\u4f86\u600e\u6a23\u7684\u512a\u52e2","breadcrumb":{"@id":"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#breadcrumb"},"inLanguage":"zh-TW","potentialAction":[{"@type":"ReadAction","target":["https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/"]}]},{"@type":"ImageObject","inLanguage":"zh-TW","@id":"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#primaryimage","url":"https:\/\/s5.tenten.co\/2023\/12\/html5_u_must_know.jpg","contentUrl":"https:\/\/s5.tenten.co\/2023\/12\/html5_u_must_know.jpg","width":250,"height":250},{"@type":"BreadcrumbList","@id":"https:\/\/tenten.co\/blog\/tech\/html5-%e6%96%b0%e7%89%b9%e8%89%b2\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/tenten.co\/blog\/"},{"@type":"ListItem","position":2,"name":"28\u500b\u5fc5\u9808\u77e5\u9053\u7684 HTML5 \u65b0\u7279\u8272"}]},{"@type":"WebSite","@id":"https:\/\/tenten.co\/blog\/#website","url":"https:\/\/tenten.co\/blog\/","name":"AI SEO by Tenten - AI-Powered SEO + Technical SEO","description":"Shopify Plus\u3001Webflow \u8a8d\u8b49\u5c08\u5bb6\uff01Tenten \u5e6b\u4f60\u5feb\u901f\u5efa\u7f6e\u5c08\u696d\u7db2\u7ad9","publisher":{"@id":"https:\/\/tenten.co\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/tenten.co\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"zh-TW"},{"@type":"Organization","@id":"https:\/\/tenten.co\/blog\/#organization","name":"AI SEO by Tenten - AI-Powered SEO + Technical SEO","url":"https:\/\/tenten.co\/blog\/","logo":{"@type":"ImageObject","inLanguage":"zh-TW","@id":"https:\/\/tenten.co\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/s5.tenten.co\/2023\/12\/site-icon.png","contentUrl":"https:\/\/s5.tenten.co\/2023\/12\/site-icon.png","width":512,"height":512,"caption":"AI SEO by Tenten - AI-Powered SEO + Technical SEO"},"image":{"@id":"https:\/\/tenten.co\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/tentencreative\/","https:\/\/x.com\/tentencreative","https:\/\/www.linkedin.com\/company\/tentenco","https:\/\/www.instagram.com\/tenten.co","https:\/\/www.youtube.com\/user\/tentencreative","https:\/\/dribbble.com\/tentenco"]},{"@type":"Person","@id":"https:\/\/tenten.co\/blog\/#\/schema\/person\/b8f2cfaa5cdbcc9a9be32ad46da81aba","name":"Nancy P","description":"Experienced Stock Market Researcher and Financial Advisor with a passion for analyzing market trends and helping clients make informed investment decisions. Combining in-depth market knowledge with personalized financial planning to deliver tailored solutions for individuals and businesses.","sameAs":["https:\/\/tenten.co","https:\/\/instagram.com\/tenten.co","https:\/\/www.linkedin.com\/in\/pladoramaria\/","https:\/\/x.com\/https:\/\/twitter.com\/tentencreative","https:\/\/www.youtube.com\/@tentencreative","https:\/\/twitter.com\/erikthought"],"url":"https:\/\/tenten.co\/blog\/author\/tenten\/"}]}},"authors":[{"term_id":533,"user_id":1,"is_guest":0,"slug":"tenten","display_name":"Nancy P","avatar_url":{"url":"https:\/\/s5.tenten.co\/2024\/06\/Kelly-w.jpg","url2x":"https:\/\/s5.tenten.co\/2024\/06\/Kelly-w.jpg"},"first_name":"Nancy","last_name":"P","user_url":"https:\/\/tenten.co","job_title":"Marketer","tiktok":"","youtube":"https:\/\/www.youtube.com\/@tentencreative","linkedin":"https:\/\/www.linkedin.com\/in\/maria-ning\/","instagram":"https:\/\/instagram.com\/tenten.co","twitter":"https:\/\/twitter.com\/tentencreative","facebook":"","description":"Experienced Stock Market Researcher and Financial Advisor with a passion for analyzing market trends and helping clients make informed investment decisions. Combining in-depth market knowledge with personalized financial planning to deliver tailored solutions for individuals and businesses."}],"_links":{"self":[{"href":"https:\/\/tenten.co\/blog\/wp-json\/wp\/v2\/posts\/3220","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tenten.co\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tenten.co\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tenten.co\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tenten.co\/blog\/wp-json\/wp\/v2\/comments?post=3220"}],"version-history":[{"count":0,"href":"https:\/\/tenten.co\/blog\/wp-json\/wp\/v2\/posts\/3220\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tenten.co\/blog\/wp-json\/wp\/v2\/media\/3224"}],"wp:attachment":[{"href":"https:\/\/tenten.co\/blog\/wp-json\/wp\/v2\/media?parent=3220"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tenten.co\/blog\/wp-json\/wp\/v2\/categories?post=3220"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tenten.co\/blog\/wp-json\/wp\/v2\/tags?post=3220"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/tenten.co\/blog\/wp-json\/wp\/v2\/ppma_author?post=3220"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}