前端三要素HTML5/CSS/JavaScript:
对于一个网页，HTML定义网页的结构，CSS描述网页的样子，JavaScript负责交互。
网页不仅可以包含文字，还可以包含图片、链接，甚至音乐、程序等非文字元素的标记语言, 这些都是基于HTML。而CSS是一种用来表现HTML的语言，能使HTML页面变得更加美观。
浏览器和用户之间的交互不仅仅是用户能浏览html中的内容，还要能对html页面操作，此时就用到了JavaScript, 其用来给HTML网页增加动态功能、交互行为，是一种解释性脚本语言。
html（超文本标记语言）、css（层叠 样式表）、JavaScript脚本语言这三样东西在浏览器端相互配合、相辅相成形成了比较成熟的前端界面。
QML 类似于网页设计的 HTML，我们可以借助 CSS 对它进行美化，也可以借助 JavaScript 进行交互。有 Web 开发经验的读者学习 QML 将非常轻松。
--------------------------------------------------------------------------------------------------------------------------------
HTML5是一种标记语言，用于定义网页的结构和内容，比如标题、段落、图片、链接等。HTML5 是 HTML 的最新版本，增加了一些新的元素和属性，比如音频、视频、画布等¹。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HTML5示例</title> </head> <body> <h1>这是一个HTML5文档</h1> <p>这是一个段落</p> <canvas id="canvas" width="200" height="200"></canvas> <script> // 在画布上绘制一个红色的圆 var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); ctx.fillStyle = "red"; ctx.beginPath(); ctx.arc(100, 100, 50, 0, Math.PI * 2); ctx.fill(); </script> </body> </html>
CSS 是一种样式表语言，用于描述网页的外观和布局，比如颜色、字体、边距、动画等。CSS3 是 CSS 的最新版本，增加了一些新的特性和模块，比如圆角、阴影、渐变、变形等²。
/* css示例 */ /* 定义一个类选择器，用于设置元素的样式 */ .example { font-family: Arial; color: blue; border: 1px solid black; } /* 定义一个id选择器，用于设置元素的样式 */ #special { font-size: 20px; font-weight: bold; }
JavaScript 是一种脚本语言，用于实现网页的交互和逻辑功能，比如表单验证、数据处理、动态效果等。JavaScript 可以在浏览器中运行，也可以在服务器端或其他平台上运行。JavaScript 的最新标准是 ES6（ECMAScript 6），增加了一些新的语法和特性，比如箭头函数、模板字符串、类、模块等³。
//javascript // JavaScript示例 // 定义一个函数，用于计算两个数的和 function add(a, b) { return a + b; } // 调用函数，并打印结果 var x = 10; var y = 20; var z = add(x, y); console.log("The sum of " + x + " and " + y + " is " + z);
QML是一种声明式语言，用于开发跨平台的应用界面，比如桌面应用、移动应用等。QML 是 Qt 框架的一部分，可以使用 JavaScript 作为脚本语言，也可以和 C++ 代码进行交互。QML 提供了一些内置的元素和属性，比如按钮、文本框、列表视图等，也可以自定义元素和样式⁴。
// qml示例 // 定义一个矩形组件，用于显示文本和图像 import QtQuick 2.15 Rectangle { width: 300 height: 300 color: "white" Text { id: text text: "Hello QML" font.family: "Arial" font.pixelSize: 30 anchors.centerIn: parent } Image { id: image source: "qt-logo.png" width: 100 height: 100 anchors.top: text.bottom anchors.horizontalCenter: text.horizontalCenter anchors.margins: 10 } }
总的来说，HTML5 和 CSS3 主要用于开发网页，JavaScript 可以用于开发网页或者其他类型的应用，QML 主要用于开发桌面或移动应用。这四个技术都有各自的优势和局限性，在不同的场景下有不同的适用性。
(1) HTML5与Qt QML仅从做UI的角度比较，哪个更便捷，哪个更强大，哪个(被渲染)性能更高呢？ - 知乎. https://www.zhihu.com/question/38867614.
(2) 入门精通web前端：三大核心HTML5、CSS3 、JS必学 - 知乎. https://zhuanlan.zhihu.com/p/369058318.
(3) 前端三要素：HTML、CSS、JavaScript介绍以及三者的关系理解 - 知乎. https://zhuanlan.zhihu.com/p/360640274.
(4) HTML5与Qt QML仅从做UI的角度比较，哪个更便捷，哪个更强大，哪个(被渲染)性能更高呢？-H5教程-PHP中文网. https://www.php.cn/html5-tutorial-112982.html.
