最近在页面中有撑出滚动条的需求,但又不想看到浏览器那丑丑的滚动条,所以研究了下解决办法:
.scroll-hidden{
width:calc(~"100% + 15px");
padding-right: 15px;
overflow: auto;
}
- 将大盒子的宽度设置为100%,同时加上滚动条的宽度,给大盒子padding-right滚动条的宽度,这样就可以将滚动条撑到页面外去。当然,不同的浏览器撑出的滚动条宽度是不一样的,想要达到页面的绝对统一也是不可能的。
- 这里的calc()f方法是less预编译器的写法,必须按照此规定写,不然是没有办法自动计算宽度的。方法里面的内容写法很重要。