iframe、meter、progress

嵌入另一个网页：iframe元素

<!DOCTYPE>
<html>
<head>
	<meta charset="utf-8">
</head>
<body>
	<p>你在等什么？？？？？？？？？？？</p>
	<iframe src="https://www.baidu.com" width="1080px" height="800px">
		抱歉
	</iframe>
</body>
</html>
  • 重点讲下iframe的sandbox属性，这是为了安全考虑而生的一个属性。如果属性为空，那么浏览器对ifranme的限制就最大，另外sandbox还有以下值：
    1. allow-forms:允许进行提交表单
    2. allow-script:允许运行执行脚本
    3. allow-same-origin:允许同域请求
    4. allow-top-navigation:允许iframe能够主导window.top进行页面跳转
    5. allow-popups:允许iframe中弹出新窗口
    6. allow-pointer-lock:允许在iframe中可以锁定鼠标

一个范围内的值：meter

用一个条表示一个值，低于low的值会变颜色，高于high的值也会变颜色

<!DOCTYPE>
<html>
<head>
	<meta charset="utf-8">
</head>
<body>
	<meter high="0.8" low="0.2" optimu="0.6" value="0.9" min="0" max="1">
		
	</meter>
</body>
</html>

进度条：progress

将数字以图像的形式来标志，来呈现一个进度条

<!DOCTYPE>
<html>
<head>
	<meta charset="utf-8">
</head>
<body>
	<progress max="1" value="0.4">
		
	</progress>
</body>
</html>
posted @ 2021-02-20 18:42  ice--cream  阅读(67)  评论(0)  编辑  收藏  举报