老师帮忙检查一下作业谢谢您
来源:2-15 编程练习
寿限无的丸子
2022-02-13 00:11:58
<html> <head> <meta charset="UTF-8"> <title>超级链接</title> </head> <body> <div> <a name="top">这里是顶部</a><br /> <a href="#水果">水果</a><br /> <a href="#蔬菜">蔬菜</a><br /> <a href="#运动">运动</a><br /> </div> <!--设置水果标题--> <div> <h2 id="水果">水果</h2> <ul> <li>香蕉</li> <li>苹果</li> <li>葡萄</li> <li>梨</li> <li>西瓜</li> <li>樱桃</li> <li>菠萝</li> <li>橙子</li> <li>柚子</li> <li>芒果</li> </ul> <!--设置返回顶部链接--> <a href="#top">返回顶部</a> <!--设置蔬菜标题--> <h2 id="蔬菜">蔬菜</h2> <ul> <li>西红柿</li> <li>黄瓜</li> <li>土豆</li> <li>芹菜</li> <li>蒜台</li> <li>西葫芦</li> <li>香菇</li> <li>菠菜</li> <li>豆角</li> <li>油菜</li> </ul> <!--设置返回顶部链接--> <a href="#top">返回顶部</a> <!--设置运动标题--> <h2 id="运动">运动</h2> <ul> <li>足球</li> <li>篮球</li> <li>橄榄球</li> <li>高尔夫</li> <li>跑步</li> <li>跳绳</li> <li>马术</li> <li>冰球</li> <li>短道速滑</li> <li>花样滑冰</li> <li>射击</li> <li>冰壶</li> </ul> <a href="#top">返回顶部</a> </div> <!--设置返回顶部链接--> </body> </html>
还有个问题是
<a name="top">这里是顶部</a>
这行代码的意义是什么呢?我去掉这个标签也可以返回顶部,这个name属性又是什么呢?
1回答
同学你好,代码实现是正确的,针对同学的问题解答如下:
1、这行代码的意义是设置锚点跳转的位置
2、因为浏览器默认有一个top属性,所以即使不设置,也可以跳转到顶部,可以将其作为特殊情况特殊记忆。
可以将锚点换成其他的,就没有这个效果了。示例:
没有设置#test锚点对应要跳转的位置,此时点击这里的“返回顶部”不会有任何效果。
只有添加了#test锚点对应要跳转的位置,才可以实现正常跳转,示例:
3、name属性就是设置锚点跳转的对应位置,要与a标签中的href属性值#后面的内容保持一致。
祝学习愉快~
相似问题
回答 1
回答 1
回答 1
回答 1
回答 1