我们一起来读书吧 关注:155贴子:2,913
  • 0回复贴,共1

css世界 6.4.5

只看楼主收藏回复

overflow与锚点定位
·锚点的两种跳转方法:1.<a>标签的name属性;2.标签的id属性。
锚点定位行为的触发条件
·URL地址中的锚链与锚点元素对应并有交互行为(定位效果的发生需要行为触发)
两种返回顶部的方法:
<a href="#">返回顶部></a>
<a href="javascript:">返回顶部></a>
作者推荐第一种,因为锚点定位行为的发生不依赖JavaScript,所以即使页面JavaScript代码失效或者加载缓慢,也不会影响正常的功能体验,也就是用户无论在什么状态下都能准确地返回顶部。
·可focus的锚点元素处于focus状态(类似链接或者按钮、输入框等可以被focus的元素在被focus时发生的页面重定位现象)
一个可读写的<imput>输入框在屏幕之外,则执行类似下面的JavaScript代码的时候:document.querySelector(input).focus();这个输入框会自动定位在屏幕之中,这些就是“focus锚点定位"。
锚点定位作用的本质
·锚点定位行为的发生,本质上是通过改变容器滚动高度或者宽度来实现的,而不是浏览器滚动高度
·锚点定位也可以发生在普通的容器元素上,而且定位行为的发生是由内而外的
“由内而外”指的是,普通元素和窗体同时可滚动的时候,会由内而外触发所有可滚动窗体的锚点定位行为
·overlow:hden跟 overlowauto和overfow: scroll的差别就于有没有那个滚动条。元素设置了overfow:hiden声明,里面内容高度溢出的时候,滚动依然存在,仅仅滚动条不存在!发生锚点定位,滚动就会发生。
·锚点定位本质上是改变了scroliTop 或scrollLeft值,定位效果等同于执行了下面的JavaScript代码:document.querySelector('.box‘).scrolITop =X


IP属地:北京1楼2025-01-20 19:53回复