html a标签 href 属性
<a href="https://www.cnblogs.com/" target="_blank">跳转到 https://www.cnblogs.com/ 这个站点</a>
<a href="www.cnblogs.com" target="_blank">跳转到站点内的www.cnblogs.com页面 </a>
a标签 href 的 URL 值
超链接的 URL 可能值:
01) 绝对 URL - 指向另一个站点(比如 href="http://www.cnblogs.com")
02) 相对 URL - 指向站点内的某个文件(href="index.htm")
02-2) 相对 URL - 指向站点内的某个文件(href="www.cnblogs.com")
[ 这里如果没有http:// , 会认为是打开站点内的文件 ]
03) 锚 URL - 指向页面中的锚(href="#top")
二: 锚点代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>a标签锚点</title> <script src="jquery-3.5.1.js"></script> <style> .btn { position: fixed; left: 10%; top: 20%; display: flex; flex-direction: column; } .btn a { width: 120px; height: 30px; color: #ffffff; } div.content{ border: 5px solid #000000; color: #ffffff; } </style> </head> <body> <div class="btn"> <span>a标签锚点</span> <a href="#dafei_01">跳转到dafei_01</a> <a href="#dafei_02">跳转到dafei_02</a> <a href="#dafei_03">跳转到dafei_03</a> <a href="#dafei_04">跳转到dafei_04</a> </div> <div class="content" id="dafei_01" style="height:100vh;background:#ff9185">我是dafei_01</div> <div class="content" id="dafei_02" style="height:100vh;background:#fff94c">我是dafei_02</div> <div class="content" id="dafei_03" style="height:100vh;background:#ffc3ca">我是dafei_03</div> <div class="content" id="dafei_04" style="height:100vh;background:#8386ff">我是dafei_04</div> </body> </html>
其他:
视窗单位 vw vh
1.vw:1vw等于视口宽度的1%。
2.vh:1vh等于视口高度的1%