VSCode 中使用 Jupyter:详尽教程
"元</td>-如何在vscode下使用jupyter的教程详解" 这篇教程主要聚焦于在Visual Studio Code (VSCode)环境下使用Jupyter Notebook的详细步骤和技巧。Jupyter Notebook是一款强大的交互式计算环境,常用于数据分析、机器学习和教学。VSCode作为一个全能的代码编辑器,支持多种编程语言,包括JavaScript,同时也提供了对Jupyter Notebook的集成,使得开发者可以在熟悉的VSCode界面中编写和运行Jupyter Notebooks。 首先,你需要确保已经安装了VSCode。接下来,需要安装Jupyter Notebook的相关扩展。VSCode Marketplace中有名为"Jupyter"的官方扩展,点击安装后,VSCode将具备运行和编辑Jupyter Notebook的功能。 1. **配置VSCode for Jupyter Notebook** - 打开VSCode,点击左侧的扩展图标,搜索并安装"Jupyter"扩展。 - 安装完成后,重启VSCode,然后可以通过文件菜单选择"打开文件夹",导入包含`.ipynb`文件的项目。 - 选择一个`.ipynb`文件,VSCode会自动识别并以Jupyter Notebook的形式呈现。 2. **运行和编辑Notebook** - 在VSCode中,可以直接在代码单元格内输入Python代码,按`Shift+Enter`运行单元格。 - 通过上下文菜单或使用键盘快捷键,可以添加、删除、移动单元格,以及切换代码和markdown单元格。 - 对于JavaScript相关的代码,虽然Jupyter Notebook原生支持Python,但通过VSCode的插件,也可以支持其他语言,包括JavaScript。 3. **利用HTML、CSS和JavaScript** - Jupyter Notebook不仅限于Python,你还可以在Markdown单元格中插入HTML、CSS和JavaScript代码,创建丰富的交互式文档。 - HTML用于结构化内容,CSS用于美化,而JavaScript可以增加动态交互性,如响应式元素、动画效果等。 - 要在Notebook中执行JavaScript,可以使用`<script>`标签,并在其中编写代码。 4. **网页制作基础** - 想要深入了解网页制作,基础的HTML、CSS和JavaScript是必备知识。 - HTML用于构建网页结构,CSS用于样式设计,JavaScript则赋予网页交互功能。 - 学习这些基础知识可以帮助你在Notebook中创建更复杂的交互式展示。 5. **实例实践与技巧** - 书中提到的实例,如"背景变换的导航菜单效果"、"跟随鼠标指针移动的图像"等,都可以在Jupyter Notebook中实现。 - 通过实例学习,理解并掌握相关技术,然后运用到实际项目中。 - 每章末尾的习题和练习有助于巩固所学,提高解决问题的能力。 6. **使用CSS和JavaScript增强Notebook** - 利用CSS可以定制Notebook的样式,比如设置背景颜色、字体大小、边框样式等。 - JavaScript可以用来添加动态效果,如定时关闭网页、鼠标经过图像时的变化、设置网页停留时间等。 这篇教程教你如何在VSCode的环境中充分利用Jupyter Notebook,结合HTML、CSS和JavaScript,创建具有丰富交互性的文档或教学材料。无论是学习网页制作的基础,还是进阶的编程技巧,都能在VSCode的Jupyter Notebook中得到实践和提升。
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
<!doctype html> <html> <head> <meta charset="UTF-8"> <style> #bills{ width: 400px; } </style> <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script> <script type="text/javascript"> $(function() { 空缺处 }); </script> </head> <body>
编号 | 分类 | 名称 | 价格(元) |
---|---|---|---|
01 | 食品 | 农夫山泉矿泉水 | 2.00 | </tr
02 | 日用品 | 洗发水 | 25.00 |
03 | 娱乐休闲 | 暑假旅游 | 5000.00 |
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
改进这段代码让它有鼠标移入图片改变的效果<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title></title> <style type="text/css"> table{ margin: 100px auto; } td{ text-align: center; } </style> </head> <body>
女靴 | ![]() | 女包 |
雪地靴 | 男包 | |
冬裙 | 登山鞋 | |
呢大衣 | 皮带 | |
毛衣 | 围巾 | |
棉服 | 皮衣 | |
女裤 | 男毛衣 | |
羽绒服 | 男棉服 | |
牛仔裤 | 男靴 |
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>酒店管理系统</title> <link rel="stylesheet" href="style.css"> </head> <body> 酒店管理系统
<main> 酒店客房管理
酒店管理系统
ID | 类型 | 价格 | 编辑 |
---|---|---|---|
1 | 单人房 | ¥200 | <button class="edit-btn">编辑</button> |
2 | 双人房 | ¥300 | <button class="edit-btn">编辑</button> |
3 | 豪华房 | ¥500 | <button class="edit-btn">编辑</button> |
添加客房
<form>![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
用以下表格,人工构建一个html文件,文件的body标签里只有一个table标签:
歌名 | 作者 | 时间 |
白月光与朱砂痣 | 大籽 | 2021 |
晴天 | 周杰伦 | 2003 |
Love Story | Taylor Swift | 2009 |
梦幻丽莎发廊 | 五条人 | 2016 |
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
完善
商品名称 | 单价 | 数量 | 总价 | 操作 |
---|---|---|---|---|
健身水杯 | 100 | <input type="number" value="1" min="1"> | 100 | <button class="btn btn-danger">删除</button> |
商品2 | 200 | <input type="number" value="1" min="1"> | 200 | <button class="btn btn-danger">删除</button> |
商品3 | 300 | <input type="number" value="1" min="1"> | 300 | <button class="btn btn-danger">删除</button> |
总价: | 600 |
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
2023057 02 05 10 17 24 32 + 03 √ × × × √ × √ × × × 3 2023058 16 31 16 15 06 15 15 05 25 15 在以上代码 用apache正则表达式提取以 开头 结束 里面的数字
<input type="checkbox" id="selectAll"> 学生编号 学生学号 学生姓名 学生性别 学生出生日期 学生地址 学生电话 学生照片 学生班级 操作 <c:forEach items="${list.list }" var="student" varStatus="status"> <input type="checkbox" name="idCheckbox" value="${student.stuId }"> ${student.stuId } ${student.stuNo} ${student.stuName } ${student.stuSex } ${student.stuBirth } ${student.stuAddress } ${student.stuPhone } ![]()
${student.classes.className } 美化一下
啊宇哥哥 -
粉丝: 35
- 资源: 3965
上传资源 快速赚钱
我的内容管理
展开
我的资源
快来上传第一个资源
我的收益 登录查看自己的收益
我的积分
登录查看自己的积分
我的C币
登录后查看C币余额
我的收藏
我的下载
下载帮助
最新资源
-
解决本地连接丢失无法上网的问题
-
BIOS报警声音解析:故障原因与解决方法
-
广义均值移动跟踪算法在视频目标跟踪中的应用研究
-
C++Builder快捷键大全:高效编程的秘密武器
-
网页制作入门:常用代码详解
-
TX2440A开发板网络远程监控系统移植教程:易搭建与通用解决方案
-
WebLogic10虚拟内存配置详解与优化技巧
-
C#网络编程深度解析:Socket基础与应用
-
掌握Struts1:Java MVC轻量级框架详解
-
20个必备CSS代码段提升Web开发效率
-
CSS样式大全:字体、文本、列表样式详解
-
Proteus元件库大全:从基础到高级组件
-
74HC08芯片:高速CMOS四输入与门详细资料
-
C#获取当前路径的多种方法详解
-
修复MySQL乱码问题:设置字符集为GB2312
-
C语言的诞生与演进:从汇编到系统编程的革命
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证 文档复制为VIP权益,开通VIP直接复制
信息提交成功
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
<input type="checkbox" id="selectAll"> | 学生编号 | 学生学号 | 学生姓名 | 学生性别 | 学生出生日期 | 学生地址 | 学生电话 | 学生照片 | 学生班级 | 操作 |
<input type="checkbox" name="idCheckbox" value="${student.stuId }"> | ${student.stuId } | ${student.stuNo} | ${student.stuName } | ${student.stuSex } | ${student.stuBirth } | ${student.stuAddress } | ${student.stuPhone } | ${student.classes.className } | 美化一下