html/css标签学习，持续Mark——iframe与<input>新特性range

最新推荐文章于 2024-02-14 21:30:31 发布

原创最新推荐文章于 2024-02-14 21:30:31 发布 · 609 阅读

1 ·

CC 4.0 BY-SA版权

html 专栏收录该内容

26 篇文章

订阅专栏

示例代码：

<!DOCTYPE html>
<html>
<body>

<iframe src="http://www.w3cschool.cc/" width="200" height="200" frameborder="0">
 <p>您的浏览器不支持  iframe 标签。</p>
</iframe>

</body>
</html>

通过iframe，达到在同一个浏览器窗口中显示不止一个页面。

另外一个html5中<input>标签的新特性，range挺好玩的，大家可以试试，代码如下，

<!DOCTYPE html>
<html>
<body>
<script>
function myFunction() {
    var x = document.getElementById("myRange").value;
    document.getElementById("show").value = x;
}
</script>
100<input type="range" id="myRange" min="100" max="500" onchange="myFunction('myRange', 'show')">500
<input type="text" id="show">
</body>
</html>

没有找在博文里使用js的方法，这能把代码直接贴出来了，效果图如下：