媒体查询:
允许您根据用户设备的特性应用不同的 CSS 样式。要使网站响应,您可以使用媒体查询定义断点并相应地调整布局、字体大小、图像和其他元素。这是一个例子:
/* CSS for screens smaller than 768px */
@media (max-width: 768px) {
/* Styles for smaller screens */
}
/* CSS for screens between 768px and 1200px */
@media (min-width: 768px) and (max-width: 1200px) {
/* Styles for medium screens */
}
/* CSS for screens larger than 1200px */
@media (min-width: 1200px) {
/* Styles for larger screens */
}
a标签
// 下载属性允许用户下载链接的资源而不是导航到它。单击时,浏览器会提示用户使用指定的文件名保存文件。
<a href="document.pdf" download>Download PDF</a>
// 使用 href 属性中的 mailto: 协议创建电子邮件链接。
<a href="mailto:contact@example.com">Send email</a>
在 HTML 中嵌入第三方平台视频内容
要嵌入第三方平台视频,请使用 iframe 标签以及提供的视频地址的嵌入代码。例如,下面是嵌入YouTube平台的视频代码示例。
<iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEO_ID" frameborder="0" allowfullscreen></iframe>
Promise.all()
Promise.all() 允许并行执行多个 Promise。它接受 Promise 数组作为输入,并返回一个新的 Promise,当数组中的所有 Promise 都已解析时,该新 Promise 就会解析。我们将这些 Promise 放入 Promise.all() 中,当所有 Promise 完成后,我们可以 then() 处理块中的响应。如果任何 Promise 被拒绝,catch() 块将处理错误。
const promise1 = fetch('https://api.example.com/data1');
const promise2 = fetch('https://api.example.com/data2');
Promise.all([promise1, promise2])
.then(responses => {
// Handle the responses to both requests here
const response1 = responses[0];
const response2 = responses[1];
// operate on the response
})
.catch(error => {
// Handle any requested errors
console.error(error);
});
解构赋值
// 解构对象
const numbers = [1, 2, 3, 4, 5];
const [first, second, , fourth] = numbers;
console.log(first); // 1
console.log(second); // 2
console.log(fourth); // 4
// 解构数组
const person = {
name: 'Rabi Siddique',
age: 25,
email: 'rabi@example.com'
};
const {name, age, email} = person;
console.log(name); // 'Rabi Siddique'
console.log(age); // 25
console.log(email); // 'rabi@example.com'