学习完了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>

运行代码

HTML5-电影影评网相关推荐

  1. HTML5学习之路（电影影评网）

    HTML5学习之路 首先了解一下HTML的特性: 1.良好的语义特性:增加了各种元素赋予网页更好的意义和结构,使文档更加清晰明确,新增的如header,article,nav,main,aside,f ...

  2. 使用HTML5制作电影影评网

    提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言 一.html5介绍 二.使用步骤 1.了解新增的几个属性和结构 2.读入数据 3.效果展示​ 总结 前言 跨平台技术这 ...

  3. 有关如何用html制作电影影评网，初阶展示

    在HTML中,无论是想用代码写出怎样的界面展示效果图,首先你都得分析其大体轮廓,再分部完善细节. 1.电影影评网分析 <!DOCTYPE html> <html>     &l ...

  4. jsp+ssm计算机毕业设计电影影评网【附源码】

    项目运行 环境配置: Jdk1.8 + Tomcat7.0 + Mysql + HBuilderX(Webstorm也行)+ Eclispe(IntelliJ IDEA,Eclispe,MyEclis ...

  5. [附源码]java毕业设计电影影评网

    项目运行 环境配置: Jdk1.8 + Tomcat7.0 + Mysql + HBuilderX(Webstorm也行)+ Eclispe(IntelliJ IDEA,Eclispe,MyEclis ...

  6. 如何利用html制作电影影评网,HTML制作电影影评网 - 手册网

    电影影评网 电影影评网 动作电影 <美人鱼> <美人鱼>是由周星驰执导,由江玉仪监制的喜剧爱情片, 邓超.罗志祥.张雨绮.林允等领衔出演[1].该片讲述 了富豪刘轩和为了拯救同 ...

  7. [附源码]计算机毕业设计JAVA电影影评网

    [附源码]计算机毕业设计JAVA电影影评网 项目运行 环境配置: Jdk1.8 + Tomcat7.0 + Mysql + HBuilderX(Webstorm也行)+ Eclispe(Intelli ...

  8. [附源码]SSM计算机毕业设计电影影评网JAVA

    项目运行 环境配置: Jdk1.8 + Tomcat7.0 + Mysql + HBuilderX(Webstorm也行)+ Eclispe(IntelliJ IDEA,Eclispe,MyEclis ...

  9. HTML5 电影影评

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  10. 制作电影影评网的html5代码,微信小程序之电影影评小程序制作代码

    本文实例为大家分享了微信小程序制作影评小程序的具体代码,供大家参考,具体内容如下 这是博主的项目包含的文件截图: 首先如图建立文件夹和page页面 然后app.json页面更新代码如下: { &quo ...

最新文章

  1. 刘强东宣布： 未来京东将减员50%，每天工作3小时！无人公司来了……
  2. [转]两分钟让你明白什么是ERP！
  3. 安装dos2unix
  4. [react] 说说你对reader的context的理解
  5. Java远程通讯技术及原理分析
  6. Go程序：变量声明、赋值与输出
  7. android真实项目教程（五）——有时三点两点雨_by_CJJ
  8. python2和python3的区别 print-Python2与Python3中print用法总结
  9. [翻译]进化游戏的层次结构 - 用组件来重构你的游戏实体
  10. 【渝粤教育】国家开放大学2018年秋季 0242-21T机械制图 参考试题
  11. 苹果Mac从睡眠模式唤醒后 Wi-Fi 无法连接如何解决？
  12. 从零基础入门Tensorflow2.0 ----六、32cifar10数据训练
  13. 质量小的夸克之间，如何互换质量大的胶子
  14. java并发包aqu_Java并发包之SynchronousQueue
  15. 怎么讲计算机屏幕录制,屏幕录制软件怎么用？教你2种屏幕录制方法
  16. 车辆控制-稳态误差分析-前馈
  17. vue实现下载excel模板、导入excel文件、导出excel文件
  18. https安全证书过期的原因
  19. 在线学习Linux的网站
  20. 小米手机电池校正_华为小米等安卓福音：超实用手机电池校正 解决电池虚标不耐用！...

热门文章

  1. 【CC2530的点对点无线通讯开发（包含BasicRf协议栈、双击、长按、呼吸灯、跑马灯）】
  2. 使用WICleanup清理Windows Installer 冗余文件
  3. 如何用matlab画负倒函数曲线,负倒描述函数
  4. 中俄边界上的田园综合体：被额尔古纳河环抱着的“世外桃源”
  5. python使用scrapy爬虫总是提示ModuleNotFoundError: No module named ‘‘
  6. IP2188中文数据手册
  7. Windows 系统查找快捷键冲突
  8. 新股网上发行申购程序
  9. python什么是多线程_python中多线程指的是什么
  10. Unity3D-VR《静夜诗》2-凝视宝剑和书籍时出现提示文本信息