-
-
网页设计(Web前端开发) 十期
主讲教师： 梁莉菁 副教授 / 萍乡学院
开课时间： 2023-02-03 至 2023-06-30教学进度：- 预报名
- 进行中
- 已结束
课程适合对网页设计与制作感兴趣的零基础的同学们，使用 DW和 HBuilder 工具，从Web发展史讲起，对Html标签、CSS样式设置作了详细讲解，并涉及简单的JS脚本以及Html5+CSS3新功能的介绍，由易到难、由简到繁，循序渐进地介绍网页前端设计与制作的基础知识与基本技能。
-
9030817
累计页面浏览量
-
5106
累计选课人数
-
11961
累计互动次数
-
-
梁莉菁
萍乡学院 2023-02-26 10:18
-
2023-06-13 21:04 林彩云
autocomplete：规定元素输入字段是否应该启用自动完成功能。 autofocus：规定当页面加载时元素应该自动获得焦点。 form：规定元素所属的一个或多个表单。 新增的表单重写属性： formaction:规定当表单提交时处理输入控件的文件的URL。 formenctype:规定当表单数据提交到服务器时如何编码。 formmethod:定义发生表单数据到action URL的HTTP方法。 formnovalidate:formnovalidate属性覆盖元素的novalidate属性。 formarget:规定标识提交表单后在哪里显示接收到响应的名称或关键词。 除了formnovalidate属性，其他属性都是只针对type=“submit"和type="image". 新增的heighth和width属性：规定元素的高度、和宽度。（只针对type=”image“）。 list：属性引用元素，其中包含元素的预定义选项。 新增的min、max和step： min:规定输入框所输入的最小值。 max:规定输入框所输入的最大值。 step：为输入框规定合法的数字间隔。 multiple：属性规定允许用户输入到元素的多个值。 pattern：规定用于验证元素的值的正则表达式。 placeholder：规定可描述输入字段预期值的简短的提示信息。 required：规定必需在提交表单之前填写输入字段。我要回复
-
-
梁莉菁
萍乡学院 2023-02-26 10:23
聊聊Web前端新技术及发展趋势
推荐给大家：前端开发学习路线2023版-黑马程序员web前端开发自学路线 http://yun.itheima.com/subject/webmap/index.html?cz 请同学们自由谈谈Web前端技术及发展趋势。
-
2023-06-13 21:04 林彩云
1、前端新标准： 2014 年 10 月 28 日，W3C 正式发布 HTML5.0 推荐标准让前端技术蓬勃发展。虽然 HTML6.0 目前处于提案阶段，但是社区已经开始有了一些零星的讨论，所以可能它离我们并不太远。2022 年，可能 HTML6 并不会推出，但是可能会有更多利于用户体验的提案出现。 Web1.0到2.0的转变，极大地改变了前端技术，Web3.0时代，可能是去中心化，可能是物联网，可能是人工智能，值得每个前端开发去关注。 2、框架、工程与体验： 前端框架 在 StackOverflow 的“最受欢迎的 Web 框架”调查中，除去 SSR 渲染框架和 jQuery，上榜的前端框架共有 5 个：React，Vue，Angular 依然是强势铁三角向前发展。在 2022 年 Vue3 会成为 Vue 的默认版本，React 18 也会发布正式版本，从目前社区关注度来看， Vue3 源码 Github star 27k+， React 18 WG Github star 3.9k+，且在 npm 的下载量上，新版本下载数目都比较可观，所以很有可能今年尝试和使用的人会变得更多。 打包器 打包器大概可以分为传统编译和ESM 混合编译，而由于 ESM 混合编译类打包器依赖于其他打包器，所以理论上 NPM 下载量永远不可能超过其依赖。同时 ESM 混合编译今年整体表现平平。 UI 框架 由于模块化CSS、摇树、MVVM 的流行，UI 框架的选择其实没有那么举足轻重了，针对自己选用的框架选择一个符合项目风格的 UI 即可。UI框架方面，预计今年也不会有黑马闯入和变动。 3、搭建智能平台： 3.1 低代码平台 2021 年开年以来，低代码行业被不断关注，也引发了众多企业的热议与调研。 低代码发展初期，厂商的类型多样化，传统软件厂商、互联网大厂均涉及低代码领域，通用型厂商相对垂直型厂商应用场景更加广泛，因此厂商数量更多。但随着市场成熟，通用类型厂商竞争加剧，垂直型厂商在细分的领域将会呈现优势明显趋势，可以进一步挖掘用户场景，提升产品能力和用户满意度。及早布局低代码产业生态，多维度拓展厂商优势，才能在未来占据高地。 3.2 AI 与图形化的探索 人工智能作为跨时代技术在各个领域大放异彩，近些年 AI 能力在前端领域的尝试与应用带来新一轮的技术革命。 阿里的 imgcook我要回复
-
-
梁莉菁
萍乡学院 2023-02-26 10:20
话题1：请总结一下本章焦点轮播图效果与跑马灯效果两大案例的技术要点。
请用自己的语言总结一下本章中焦点轮播图效果与跑马灯效果两大案例制作时最重要的知识点与技术要点。找找网上各种经典精彩的轮播图效果，将网址或技术要点等内容贴出，推荐给大家共享。
-
2023-06-13 21:04 林彩云
第一步：创建三个文件。 .html文件， .css文件, .js文件 在创建一个img文件夹用来放图片 我这里的文件名字：轮播图.html 轮播图.css 轮播图.js（文件名最好是英文） 第二步：通过html把框架搭好。 注意的点：1、script标签引外部js时，加上defer（加载完成html后，在加载js），避免获取不到元素的情况。 2、js获取外部css样式修改的时候，也就是没有在html文件里的样式，有可能js获取不到，所以上面代码中需要改变的left值，还有图片还有外部盒子的宽度，我都写在了html里，也方便了如果图片大小改变时，**只需要修改html文档就好，css和js代码都不需要动。 第三步：写css样式。 1、写css把图片横向布局，并且通过overflow：hidden的方式把外面的图片隐藏 2、给ul设置定位，并把left设置为0px;也就是向左偏移为0 （如果是上下轮播，图片纵向布局，top为0px） 第四步：通过写js来改变图片的left值，使其动态显示。 1、使左右两个图片居中，根据图片的高度，（图片高度-箭头高度） 2、根据图片个数，创建小圆点的个数 3、改变left值使图片位置发生变换 4、给两个箭头绑定点击事件 5、给下面的圆点绑定点击事件 6、设置计时器（第一个参数为，右点击函数，第二个参数为几秒执行一次） 7、鼠标移入移出事件（移入图片计时器停止轮播结束，移出图片计时器开始轮播继续）我要回复
-
-
梁莉菁
萍乡学院 2023-02-26 10:18
谈谈你对网页布局技术的理解？
网页布局技术经历了表格布局，DIV+CSS布局，响应式布局等多次更新进化，请查询相关网络资源，谈谈你对网页布局技术的理解？可以仅从网页布局技术的某一方面入手，简要概括自己的观点。
-
2023-06-13 21:04 林彩云
网页页面的大体结构： 1.做网页之前先观察网页的头部，内容，底部，然后把版心确定下来，这是我做网页的第一步。 网页项目文件夹的格式： 2.大致文件夹方面一个css文件夹，js一个文件夹，index首页放在最外面，其余的页面的html文件放在新建的html文件夹里，同时注意命名规范。 公共css样式的初始化： 3.把系统默认的标签属性给清除掉，网页的 css，js文件引入css放在最上面，js文件引入放在最下面，这样能提高网页性能。我要回复