HTML5 提供了新的语义标签、表单增强、多媒体标签等特性。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML5 Example</title>
</head>
<body>
<header>页面头部</header>
<nav>导航链接</nav>
<section>
<article>
<header>文章标题</header>
<p>这是一个段落。</p>
</article>
</section>
<aside>侧边内容</aside>
<footer>页面底部</footer>
</body>
</html>CSS3 引入了更丰富的选择器、背景和边框的装饰效果、过渡和动画等特性。
/* CSS3 Example */
header {
background: linear-gradient(to right, red, yellow);
border-radius: 10px;
}
nav a {
text-decoration: none;
color: blue;
}
article section:nth-child(odd) {
background-color: lightgrey;
}
aside {
float: right;
background: rgba(255, 0, 0, 0.5);
}
footer {
transition: color 2s;
}
footer:hover {
color: lightcoral;
}ES6（ECMAScript 2015）引入了模块、类、箭头函数、let和const声明等新特性。
// ES6 Example
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
greet() {
console.log(`Hello, my name is ${this.name}`);
}
}
const greet = () => console.log('Hello, World!');
import { sum } from './math';
console.log(sum(5, 7));在实际开发中，可以结合这些新特性创建现代化的Web应用。