学习完了HTML5的新标签，然后结合之前的案例做了第一个小案例。自我感觉良好。下面我来展示一下图片
这是我浏览其他网站的时候以为发现的新功能可以运行代码，这是运行之后截得图片。自我感觉照片还是蛮高大上的。如果以后博客园也有运行代码的功能就好了。
下面是我的代码：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>电影影评网</title> </head> <body> <header > <h2 align="center">电影影评网</h2> <p align="center"> <img width="80%" src="img/header.jpg" /> </p> </header> <nav> <p width="80%" align="center"> <img width="15%" height="200" src="img/01.jpg" /> <img width="15%" height="200" src="img/02.jpg" /> <img width="15%" height="200" src="img/03.jpg" /> <img width="15%" height="200" src="img/05.jpg" /> <img width="15%" height="200" src="img/06.jpg" /> </p> </nav> <article align="center"> <details > <summary >动作电影</summary> <ul align="left" contenteditable="true"> <li> <figcaption>《美人鱼》</figcaption> <p >《美人鱼》是由<mark>周星驰</mark>执导，由江玉仪监制的喜剧爱情片， <mark>邓超、罗志祥、张雨绮、林允</mark>等领衔出演[1].该片讲述 了富豪刘轩和为了拯救同族前往刺杀他的美人鱼珊珊坠入 爱河，谱写了一段人鱼爱情童话的故事。</p> <img src="img/movie01.jpg" /> </li> <li> 大众评分：<meter value="65" min="0" max="100" low="60" high="80" title="65分" optimum="100">65</meter> </li> <li> 媒体评分：<meter value="80" min="0" max="100" low="60" high="80" title="80分" optimum="100">80</meter> </li> <li> 网站评分：<meter value="70" min="0" max="100" low="60" high="80" title="70分" optimum="100">70</meter> </li> </ul> <hr size="3" color="#ccc" /> <ul align="left" contenteditable="true"> <li> <figcaption>《陆垚知马俐》</figcaption> <p>《陆垚知马俐》是由<mark>文章</mark>，<mark>陈可辛</mark>监制， <mark>包贝尔、宋佳、朱亚文、焦俊艳</mark>主演的爱情喜剧电影。 影片讲述了陆垚在上大学时重逢幼儿园同学马俐， 虽然彼此心存好感，但由于陆垚有严重的“表白障碍症”， 只能眼巴巴看着自己的女神马俐与别人谈恋爱。 而自此之后很多年，陆垚只能以朋友的名义爱着马俐， 也与她开始了一段“友情不甘、恋人不敢”的长跑。</p> <img src="img/movie02.jpg" /> </li> <li> 大众评分：<meter value="75" min="0" max="100" low="60" high="80" title="75分" optimum="100">75</meter> </li> <li> 媒体评分：<meter value="90" min="0" max="100" low="60" high="80" title="90分" optimum="100">90</meter> </li> <li> 网站评分：<meter value="70" min="0" max="100" low="60" high="80" title="70分" optimum="100">70</meter> </li> </ul> </details> </article> </body> </html>