-
锚点位置偏移的方法
网络 2016/11/19 23:02:20昨天在sf的时候看到了一位朋友的提问，是问如何使页面上的a标签被点击时跳转的锚点的位置往下偏移一点，不会被最上方的header给遮盖。当时看到这个问题也没想出纯CSS的解决方法，以为只有用js才能实现，后来另一位朋友的解答，恍然大悟，在他给出的方法上加以修改，完美实现了纯CSS的解决方案。
HTML部分
<div style="height: 50px;background:grey;position:fixed;top:0;left:0;right:0;z-index:100;"></div><div style="height:200px;background:green;"></div><a href="#hehe">click me</a><div style="height:600px;background:pink;"></div><a name="hehe" class="target"> <span class="placeholder"></span> I am here. You can see me.</a><div style="height:600px;background:purple;"></div><div style="height:600px;background:yellow;"></div>
CSS部分
*{ margin:0; padding:0; }.target { position: relative; }.placeholder { position: absolute; display:block; width:100px; //小于父级宽度的值 height:50px; //高度值为顶部固定块的高度 top: -50px; //值为顶部固定块的高度}阅读(5236) 分享(0)
上一篇: PHP中9大缓存技术总结
下一篇: JS日期格式化扩展函数
