HTML / CSS / JS 编程入门 —— 使用 Lightly 制作可切换主题的简单网页

这篇博客介绍了HTML、CSS和JavaScript在网页制作中的作用,以及如何使用集成开发工具Lightly创建一个可以切换浅色和深色主题的简单网页。通过实践步骤,读者将学习到HTML的基础结构、CSS的设计应用和JavaScript的交互功能实现。

HTML、CSS 和 JavaScript 是前端编程密不可分的三大语言,我们一般看到的网页都由这三种语言组合编程而成。这三者之间究竟有什么样的关系?他们又是通过什么样的软件编成的呢?

目录
1. HTML、CSS 和 JavaScript 之间的关系
2. 网页制作实战
        - 在 Lightly 创建 HTML 文件
        - 使用 HTML 建立框架
        - 使用 CSS 设计网页
        - 使用 JavaScript 实现主题切换

HTML、CSS 和 JavaScript 之间的关系

我们平时看到的网页就像是一座已经建好的房子,而这三个编程语言则分别负责房子的结构(Structure)、样式(Styling)和功能(Functionality)。对一个完整的网页而言,三者几乎缺一不可。但在极端情况下,只要有 HTML 就可以制作出最简单的网页,CSS 和 JavaScript 则会为网页赋予更精美的样式和更多样的功能。

 .HTML 文件:网页的基本架构,一般在这里调用 CSS 和 JS 文件
.CSS 文件:网页样式文件,调整网页的整体颜色、位置、字体、按钮等设计
.JS 文件:赋予网页的交互功能,例如:用户点击、输入等操作会触发哪些功能

网页制作实战

在学习编程的时候,最重要的就是直接动手尝试,从实际挑战中逐渐作出调整。这个网站制作教程将根据以下几个步骤,手把手带你制作一个简易的网站,让你了解 HTML、CSS 和 JS 之间的关系与基本操作:

  1. 草拟网站内容
  2. Lightly 中编写代码
  3. 使用 HTML 建立网站基本框架
  4. 使用 CSS 调整网站设计
  5. 使用 JavaScript 添加网站功能

我们在此次教程中使用轻量且

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值