Web前端开发项目案例教程 课件全套 李洪建 项目1--5 蔬菜科技展示网 ---山东多彩生活网.pptx

项目1蔬菜科技展示网

HTML5的优势解决了跨浏览器的问题新增多个新特性（语义化标签、多媒体标签、canvas元素、本地存储等）用户优先原则化繁为简的优势学习目标知识目标掌握VisualStudioCode工具与插件的安装掌握HTML5文档结构、标签与元素、语义化和结构标签掌握HTML5的常用标签与标签属性掌握表格、表单和列表的设置与属性技能目标熟练使用VisualStudioCode工具开发Web项目熟练使用HTML5的常用标签搭建简单的网站页面熟练使用表格与表单搭建简单的表格页面与技术调查页面素质目标培养学生对Web前端开发的兴趣和热情，鼓励学生不断学习和探索新技术培养学生具备团队合作精神，能够与他人合作完成网页开发项目

HTML5的优势解决了跨浏览器的问题新增多个新特性（语义化标签、多媒体标签、canvas元素、本地存储等）用户优先原则化繁为简的优势学习目录任务1搭建蔬菜科技展示网站开发环境任务2搭建蔬菜科技展示网站首页任务3搭建蔬菜种植技术页面任务4搭建病虫害防治页面任务5搭建农业技术页面任务6搭建农业技术调查页面任务7搭建关于我们页面

HTML5的优势解决了跨浏览器的问题新增多个新特性（语义化标签、多媒体标签、canvas元素、本地存储等）用户优先原则化繁为简的优势项目描述蔬菜科技展示网站包含首页、蔬菜种植技术页面、病虫害防治方法页面、农业技术页面、农业技术调查页面和关于我们页面，实现基本的网站结构和信息展示功能。通过本项目的学习，读者将掌握HTML常用标签的使用、页面布局、图文混排以及超链接等知识。

任务1搭建蔬菜科技展示网站开发环境1

HTML5的优势解决了跨浏览器的问题新增多个新特性（语义化标签、多媒体标签、canvas元素、本地存储等）用户优先原则化繁为简的优势需求分析需求的具体介绍如下。1.Web网站开发需要明确开发工具版本，以及下载、安装与使用开发工具。2.本书使用的开发工具是VisualStudioCode1.88.1。3.下载与安装VisualStudioCode工具。4.使用VisualStudioCode工具创建第一个HTML网页。

HTML5的优势解决了跨浏览器的问题新增多个新特性（语义化标签、多媒体标签、canvas元素、本地存储等）用户优先原则化繁为简的优势知识储备一、初识Web前端二、Web标准三、Web前端的三大核心技术四、浏览器五、下载与安装VisualStudioCode六、安装插件七、VisualStudioCode的使用

HTML5的优势解决了跨浏览器的问题新增多个新特性（语义化标签、多媒体标签、canvas元素、本地存储等）用户优先原则化繁为简的优势一、初始Web前端1.前端的发展演变

在互联网的发展过程中，Web前端发展初期的HTML（HyperTextMarkupLanguage）技术只能展示简单的网页，极其不易于开发者维护与更新网站。Web前端发展初期被称为Web1.0时代。互联网进入Web2.0时代以后，涌现出大量的类似于桌面软件的Web应用，用户不仅能浏览网页，还能对网页上的内容进行操作。

HTML5的优势解决了跨浏览器的问题新增多个新特性（语义化标签、多媒体标签、canvas元素、本地存储等）用户优先原则化繁为简的优势一、初始Web前端2.服务器端渲染和客户端渲染服务器端渲染网页经过后端服务器返回给前端的完整HTML文件，再由浏览器进行解析并展示整个网页。前端获得json数据之后，在前端进行HTML网页的拼接，最后展示在浏览器上。客户端渲染

HTML5的优势解决了跨浏览器的问题新增多个新特性（语义化标签、多媒体标签、canvas元素、本地存储等）用户优先原则化繁为简的优势二、Web标准Web标准不是某一个标准，而是一系列标准的集合。网页主要由结构（Structure）、表现（Presentation）和行为（Behavior）3部分组成。对应的标准也分为3类，结构化标准语言主要包