鱼C论坛

 找回密码
 立即注册
查看: 1235|回复: 5

请问做这种按键应该看什么教程?

[复制链接]
发表于 2024-8-28 08:42:02 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能^_^

您需要 登录 才可以下载或查看,没有账号?立即注册

x
请问做这种按键应该看什么教程?
新手  无法上传图片
请问新手应该看那个教程,那种点一下就生成那种按钮?
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

发表于 2024-8-28 08:42:23 | 显示全部楼层
要制作一个点击生成按钮的功能,建议学习以下几个方面的内容:

1. **HTML**: 学习如何创建基本的网页结构和按钮元素。
2. **CSS**: 学习如何美化按钮,使其看起来更吸引人。
3. **JavaScript**: 学习如何使用JavaScript来实现按钮的点击事件和动态生成新按钮的功能。

以下是一个简单的示例,展示如何使用HTML、CSS和JavaScript来实现点击生成按钮的功能:

  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <title>生成按钮示例</title>
  7.     <style>
  8.         .button {
  9.             padding: 10px 20px;
  10.             margin: 5px;
  11.             background-color: #4CAF50;
  12.             color: white;
  13.             border: none;
  14.             cursor: pointer;
  15.         }
  16.     </style>
  17. </head>
  18. <body>
  19.     <button id="generateButton" class="button">生成新按钮</button>
  20.     <div id="buttonContainer"></div>

  21.     <script>
  22.         document.getElementById('generateButton').addEventListener('click', function() {
  23.             var newButton = document.createElement('button');
  24.             newButton.className = 'button';
  25.             newButton.innerText = '新按钮';
  26.             document.getElementById('buttonContainer').appendChild(newButton);
  27.         });
  28.     </script>
  29. </body>
  30. </html>
复制代码


### 学习资源推荐

1. **HTML & CSS**:
   - [MDN Web Docs - HTML](https://developer.mozilla.org/zh-CN/docs/Web/HTML)
   - [MDN Web Docs - CSS](https://developer.mozilla.org/zh-CN/docs/Web/CSS)

2. **JavaScript**:
   - [MDN Web Docs - JavaScript](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript)
   - [W3Schools - JavaScript](https://www.w3schools.com/js/)

通过这些资源,你可以逐步掌握制作动态按钮的技能。希望这些信息对你有帮助!

以上回复来自 FishC AI 小助理,如未能正确解答您的问题,请继续追问。
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

 楼主| 发表于 2024-8-28 08:47:30 | 显示全部楼层
十分感谢,初学者,初中学历,能否找个网上的视频教程共享一下。
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2024-8-28 08:47:37 | 显示全部楼层
大熊猫之家 发表于 2024-08-28 08:47
十分感谢,初学者,初中学历,能否找个网上的视频教程 ...


当然可以!这里有一些适合初学者的视频教程,希望对你有帮助:

1. **HTML & CSS**:
   - 网易云课堂《前端开发入门初级:HTML + CSS 基础入门》:[在这里观看](https://study.163.com/course/courseMain.htm?courseId=1004899048)
   - B站上的《黑马程序员前端视频教程》:[在这里观看](https://www.bilibili.com/video/BV1XZ4y1K748)

2. **JavaScript**:
   - 网易云课堂《JavaScript基础入门》:[在这里观看](https://study.163.com/course/courseMain.htm?courseId=1005042038)
   - B站上的《JavaScript基础教程》:[在这里观看](https://www.bilibili.com/video/BV1xx411T7Cs)

这些视频教程适合初学者,通俗易懂,可以跟着视频一步步学习。希望这些资源能够帮助你更好地掌握如何制作动态按钮,祝你学习愉快!

以上回复来自 FishC AI 小助理,如未能正确解答您的问题,请继续追问。
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

 楼主| 发表于 2024-8-28 09:29:57 | 显示全部楼层
FishC 发表于 2024-8-28 08:47
当然可以!这里有一些适合初学者的视频教程,希望对你有帮助:

1. **HTML & CSS**:

链接已全部失效 404了
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2024-8-28 09:30:06 | 显示全部楼层
大熊猫之家 发表于 2024-08-28 09:29
链接已全部失效 404了


非常抱歉给您带来了不便,以下是更新后的资源:

### HTML & CSS 视频教程
1. **B站:黑马程序员-前端入门系列:HTML和CSS**
   [HTML基础入门](https://www.bilibili.com/video/BV1XJ411L7mc)
   [CSS基础入门](https://www.bilibili.com/video/BV1xJ41127ZK)

2. **妙味课堂 - HTML&CSS入门**
   [HTML和CSS视频教程](https://www.bilibili.com/video/BV1yW411u7VR)

### JavaScript 视频教程
1. **B站:黑马程序员-前端入门系列:JavaScript**
   [JavaScript基础入门](https://www.bilibili.com/video/BV1WJ41137hu)

2. **慕课网 - JavaScript基础入门**
   [JavaScript初学者入门视频](https://www.imooc.com/learn/36)

请尝试这些资源,希望它们能够帮助你更好地学习和掌握HTML、CSS以及JavaScript的基础知识。如果有其他问题,请随时告知!

以上回复来自 FishC AI 小助理,如未能正确解答您的问题,请继续追问。
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2025-5-9 12:28

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表