js网页制作案例 - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

基于HTML+CSS+JS制作蛋糕商城（web前端网页制作课作业）

✍️ 作者简介: 一个热爱把逻辑思维转变为代码的技术博主作者主页: 【主页——获取更多优质源码】 web前端期末大作业：【毕设项目精品实战案例 (1000套) 】程序员有趣的告白方式...：【HTML七夕情人节表白网页制作 (110套) 】超炫酷的Echarts大屏可视化源码：【 echarts大屏展示大数据平台可视化(150套) 】免费且实用的WEB前端学习指南：【web前端零基础到高级学习视频教程...一、‍网站题目美食网页介绍、甜品蛋糕、地方美食小吃文化、餐饮文化、等网站的设计与制作。...网站文件方面：网站系统文件种类包含：html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件；网页编辑方面：网页作品代码简单，可使用任意HTML编辑软件（如：Dreamweaver..., 表单提交, 点击事件等等（个别网页中运用到js代码）。

2.2K2 0

使用reveal.js制作精美的网页版PPT

但苦于mac上运行PPT那感人的流畅度, 成功的激起了笔者的强迫症, 所以索性想办法通过技术的手段来做个网页版PPT, 这个时候笔者发现了reveal.js: 一个使用 HTML 语言制作演示文稿的 Web...花了15分钟系统的调研了一下, 觉得基本满足技术分享类PPT的要求, 所以决定采用该方案来实现我的网页版PPT. 这里列一下笔者的技术调研方法论, 供大家参考: ?...制作需要花费大量时间, 受平台限制所以对于不熟悉PPT套路的技术工作者来说, 往往很难快速制作出精美的PPT. 接下来我们再看看reveal.js的优势. ?...reveal.js可以把 Markdown 文件转为类似 PPT 的演示文稿，轻快省力，减少排版上的时间，让演讲者更专于文字内容；同时，也获得 PPT 所不具有的灵活性制作发布灵活、不限应用，不限平台...接下来我们就来实现一个动态的PPT demo, 供大家学习参考. reveal.js制作一个一个动感PPT的demo 效果演示请访问地址: https://user-gold-cdn.xitu.io/2020

5K2 0

您找到你想要的搜索结果了吗？

是的

没有找到

网页制作---HTML

9.5K1 0

JS-制作网页特效——选项卡效果（水平，点击）

--清爽js代码如下--> 1 2 window.onload = function() { 3

5K9 0

JS-百钱买百鸡案例-for循环制作

<html> <head> <meta charset="utf-8"/> <title></title> <script> //作业：for循环...

2K5 0

黑马程序员----基于BootStrap框架的网页制作综合案例

网页制作综合案例完整源码: 效果演示: ---- 完整源码: 网页主体部分有内容时，才会显现出来--> js事件--> js/jquery-1.11.3.min.js"> js/bootstrap.min.js"> ---- 效果演示:

8932 0

制作网页的简单步骤制作网页的软件推荐

然而建设一个网站并不容易，那么如何制作网页才能使得步骤最大化的变得简单呢？又有什么专业的网站编辑软件可以应用呢？下面就来为大家简单介绍一下。...image.png 一、制作网页的简单步骤想要制作一个网站，首先第一步就是购买一个合适的服务器，确定自己开设网站的主要受众。在服务器申请成功后就可以开始着手进行网页的设计了。...二、制作网页所需软件推荐制作网页是一项十分复杂项目，为了简化操作步骤，大家就要学会去运用各式各样的网页开发者工具来进行辅助。...这款软件是一种集合了网站管理与网站的制作为一体的软件。支持许多种的编译语言的设定使得这款软件成为一个受人欢迎的网站编辑软件。以上就是为大家带来的关于制作网页的简单步骤。...想要制作出属于自己的网站，不妨可以尝试一下Adobe Dreamweaver。相信这款软件可以为网站的编辑带来诸多的方便。

5.3K5 0

网页|HTML表格制作

问题描述用html表格制作如何能够做出一个类似Excel的表格呢？...在我们学习工作想要做出一个表格的时候，我们通常会直接打开Excel，但其实，使用html进行表格制作时，更能体会到敲代码的魅力。...图3.3跨行单元格结语在使用html表格制作的过程中，体会到了自己敲代码做表格的魅力，但同时过程也遇到了一些问题。

15.4K1 0

网页制作的总结

你可以按以下方法处理：在浮动元素后加个div设置clear: both; height:0,overflow:hidden 使用clearfix; 设置父元素浮动; 四.制作弹出层需要的知识点：

3.4K2 0

零基础学网页开发入门（制作博客案例）适应手机端div+css+js的综合介绍

www.dcloud.io 二、网页开发基础 1.网站文件结构： 1.css文件夹用来存储网页的皮肤样式 2.img文件夹用来存储网页的图片 3.js文件夹用来存储控制网页用户交互的文件以及...我们在web前段开发中，通过采用div+css+js的形式来写我们的网页。...：网页内部内容结构六、JS入门 js是javascript的简称。...我们可以使用js来控制我们的网页中的图片等元素。...引入js文件举例使用（文件名称可以自行改变）： js/main.js"> js中的消息框，举例提示刘金玉编程几个字： alert("刘金玉编程") 我们使用一个

1.9K3 0

杨老师课堂之网页制作HTML的学习入门-含有案例

网页制作入门 - Html的学习本篇所授任务网站信息页面案例网站图片信息页面案例网站友情链接页面案例网站首页案例网站注册页面案例网站后台页面案例教学导航教学目标了解什么是标记语言...教学目标了解HTML主要特性,主要变化及发展趋势教学目标了解HTML的结构标签教学目标掌握HTML的主要标签(字体,图片,列表,链接,表单等标签教学方法案例驱动法 1.1 网站信息页面显示案例...： 1.1.1 需求分析：在网页中显示一个文字信息页面，显示效果如下： ?... 1.2 网站的图片页面显示 1.2.1 需求分析：在网页中显示带有图片的页面效果如下： ?...--网页连接-->

2K2 0

用canvas制作彩虹球喷枪（js面向对象小案例）

前段时间在研究canvas，感觉还挺好玩的，就写了一个小demo，效果如下： canvas.gif 第一次尝试用js面向对象的方式来写，经验不足，还请大家多多包涵。...width='1050' height='500' style='background:#333;overflow: hidden;'> 彩虹球的随机颜色是通过下面两个方法来实现的，在《js...ColorBall.prototype.left = 0; //X轴 ColorBall.prototype.top = 0; //y轴 ColorBall.prototype.r = 10; //半径在本案例中...案例的主要逻辑如下： var rainbowBrush = new RainbowBrush(); //初始化彩虹球喷枪 var balls = rainbowBrush.getBalls(1); /...(context,balls,x,y); } canvasDom.onmouseup = function(){ flag = false; } } 案例全部代码

2.1K7 0

网页|如何制作一个HTML网页

HTML（Hypertext MarkupLanguage）也叫作超文本标记语言，是一种用来结构化 Web 网页及其内容的标记语言，标准通用标记语言下的一个应用，可以使用 HTML 来建立自己的 WEB...网页制作中大多数时候会插入图片或链接，这也是必学基础内容。解决方案 1.HTML元素 HTML 元素以开始标签起始，以结束标签终止。没有内容的 HTML 元素被称为空元素。...图5 编写网页示例结语此阶段学习的HTML，虽然只是入门级别，但要写出一个好的网页，熟练掌握基础技术和知识是必不可少的。END

6.3K6 0

期末前端web大作业——名侦探柯南网页制作 Hbuiderx制作网页静态HTML网页单页制作 dreamweaver网页设计与制作代码 web前端期末大作业

HTML实例网页代码, 本实例适合于初学HTML的同学。...='4px'> ❤ 【作者主页——获取更多优质源码】 ❤ 【web前端期末大作业——毕设项目精品实战案例...(1000套)】 --- @TOC 一、网页介绍 1 网页简介：此作品为学生个人主页网页设计题材，HTML+CSS 布局制作,web前端期末大作业,大学生网页设计作业源码，这是一个不错的网页制作，画面精明...2.网页编辑：网页作品代码简单，可使用任意HTML编辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html...页脚四大部分；undefined 所有页面相互超链接，可到三级页面，有5-10个页面组成；页面样式风格统一布局显示正常，不错乱，使用Div+Css技术；菜单美观、醒目，二级菜单可正常弹出与跳转；要有JS

4.5K4 0

分享:通过Animate 和wow.js 快速制作你的网页特效

Animate 和wow.js Animate 通过CSS3封装的一个css插件 wow.js 可以链接到CSS动画库两者配合起来可以快速制作你的网页特效安装 wowjs安装通过CDN js"> <link href="https://cdn.bootcss.com/animate.css...github.com/matthieua/WOW Animate github地址:https://github.com/daneden/animate.css 使用通过CDN连接wow和animate后,需要通过js

6.3K3 0

JS网页跳转

通过javascript中实现跳转 // 直接跳转 window.location.href='index.html'; // 定时跳转 setTimeout(...

30.5K3 0

Cleaver快速制作网页PPT

如今即便薄学如我就已然知晓reveal.js impress.js等各种轮子来制作体验优良的网页PPT。今天就来尝试下这Node.js的轮子Cleaver来制作网页PPT。...Cleaver介绍如果你已经有了一个Markdown的文档，30秒就可以制作成幻灯片。Cleaver是为Hacker准备的工具。...Cleaver的官方发布页：http://jdan.github.io/cleaver/；参考文章:30秒制作幻灯片 Cleaver。...layout: 设置HTML模板(template: template/layout.mustache) Cleaver的正文内容: Cleaver仅支持Markdown语法的，通过Markdown构建网页内容...写在最后相比于之下，impress.js, reveal.js以及Cleaver三者各有特色吧；在唯快不破的理论下，Cleaver自然占据了无与伦比的优势，只是像动画，样式等比于impress是一个短板

4.4K8 0

常见网页特效案例

案例：网页轮播图轮播图也称为焦点图，是网页中比较常见的网页特效。功能需求： 1.鼠标经过轮播图模块，左右按钮显示，离开隐藏左右按钮。...案例：返回顶部带有动画的返回顶部此时可以继续使用我们封装的动画函数只需要把所有的left 相关的值改为跟页面垂直滚动距离相关就可以了页面滚动了多少，可以通过 window.pageYOffset...案例：筋头云案例利用动画函数做动画效果原先筋斗云的起始位置是0 鼠标经过某个小li，把当前小li的offsetLeft 位置做为目标值即可鼠标离开某个小li，就把目标值设为 0

3.3K4 0

网页轮播图案例

案例：网页轮播图轮播图也称为焦点图，是网页中比较常见的网页特效。功能需求： 1.鼠标经过轮播图模块，左右按钮显示，离开隐藏左右按钮。 ...案例分析1 ① 因为js较多，我们单独新建js文件夹，再新建js文件，引入页面中。 ② 此时需要添加 load 事件。 ③ 鼠标经过轮播图模块，左右按钮显示，离开隐藏左右按钮。...案例分析2. ① 动态生成小圆圈 ② 核心思路：小圆圈的个数要跟图片张数一致 ③ 所以首先先得到ul里面图片的张数（图片放入li里面，所以就是li的个数） ④ 利用循环动态生成小圆圈（这个小圆圈要放入...案例分析4. ① 点击小圆圈滚动图片 ② 此时用到animate动画函数，将js文件引入（注意，因为index.js 依赖 animate.js 所以，animate.js 要写到 index.js...案例分析5. ① 点击右侧按钮一次，就让图片滚动一张。 ② 声明一个变量num，点击一次，自增1，让这个变量乘以图片宽度，就是 ul 的滚动距离。

3K1 0

大一学生《基于HTML+CSS制作体育篮球网页》期末网页制作

一、‍网站题目校园篮球网页设计、⚽足球体育运动、体育游泳运动、兵乓球、网球、等网站的设计与制作。... 二、✍️网站描述 ️ 大学生校园运动静态HTML网页设计作品，采用DIV CSS布局制作，内容包括：校园运动、运动技巧、运动规则、技术规则、经典动作。页面主体内容区域宽度为1200PX。...网页整体使用CSS设置了网页背景图片。页面精美包含多个排版布局，学生网页作业水平制作。...网站文件方面：网站系统文件种类包含：html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件；网页编辑方面：网页作品代码简单，可使用任意HTML编辑软件（如：Dreamweaver..., 表单提交, 点击事件等等（个别网页中运用到js代码）。

3K2 0

点击加载更多

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭