超文本标记语言，标准通用标记语言下的一个应用。是网页制作必蚩狠希搁备的编程语言“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。超文本标记语言的结构窄忾行崦包括“头”部分（英语：Head）、和“主体”部分（英语：Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。
工具/原料
电脑
HTML编辑器
方法/步骤
1、第一步：编写HTML页面主要包括是窗口全屏（类似F11的功能）让body独占整个空间。&l隋茚粟胫t;!DOCTYPEhtml><h墉掠载牿tml><head><metacharset="UTF-8"><title>demo</title><scriptsrc="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script></head><body><buttononclick="requestFullScreen(document.documentElement)">body全屏</button><buttononclick="exitFull()">退出全屏</button><div><ul><li><imgsrc="img/cartoon/1116422.gif"/><br/><p>魁拔1</p></li><li><imgsrc="img/cartoon/A011.jpg"/><br/><p>血色苍穹</p></li><li><imgsrc="img/cartoon/A018.jpg"/><br/><p>纳米核心</p></li><li><imgsrc="img/cartoon/海贼王.jpeg"/><br/><p>海贼王</p></li></ul></div><script>//窗口状态改变事件fullscreenchange(document,function(isFull){console.log(isFull);});/*封装*///窗口状态改变functionfullscreenchange(el,callback){el.addEventListener("fullscreenchange",function(){callback&&callback(document.fullscreen);});el.addEventListener("webkitfullscreenchange",function(){callback&&callback(document.webkitIsFullScreen);});el.addEventListener("mozfullscreenchange",function(){callback&&callback(document.mozFullScreen);});el.addEventListener("msfullscreenchange",function(){callback&&callback(document.msFullscreenElement);});}//全屏functionrequestFullScreen(element){varrequestMethod=element.requestFullScreen||//W3Celement.webkitRequestFullScreen||//Chrome等element.mozRequestFullScreen||//FireFoxelement.msRequestFullScreen;//IE11if(requestMethod){requestMethod.call(element);}elseif(typeofwindow.ActiveXObject!=="undefined"){//forInternetExplorervarwscript=newActiveXObject("WScript.Shell");if(wscript!==null){wscript.SendKeys("{F11}");}}}//退出全屏functionexitFull(){varexitMethod=document.exitFullscreen||//W3Cdocument.mozCancelFullScreen||//Chrome等document.webkitExitFullscreen||//FireFoxdocument.webkitExitFullscreen;//IE11if(exitMethod){exitMethod.call(document);}elseif(typeofwindow.ActiveXObject!=="undefined"){//forInternetExplorervarwscript=newActiveXObject("WScript.Shell");if(wscript!==null){wscript.SendKeys("{F11}");}}}</script></body></html>素材如下：
2、第二步：测试F11的功能。打开页面，按F11键全屏页面再次按下F11键返回
3、第三步：测试body全屏功能。F11实现的功能和按钮body全屏实现的功能基本一致，区别是F11全屏只能F11返回。
