使用rem布局实质上是将网页视图等比放大缩小,也就是说,不管你使用多大的屏幕,你看到的内容范围都是一样的,这与用户体验是违背的。
css样式 移动端禁止长按屏幕选中
css特性查询 @supports及Window.CSS.supports()
一行css代码让网站变灰(悼念模式)
前后端分离后台管理系统 实现细粒度的权限控制
使用border-image制作渐变边框在ios遇到的兼容性问题
BFC 类似一个“结界”,如果一个 DOM 元素具有 BFC,那么它内部的子元素不会影响外面的元素;外面的元素也不会影响到其内部元素。
轮播图和tab其实是一回事,都是实现内容区域的手动切换或自动轮换。 使用方式: 引入html模板,css,js文件, 实例化Tab构造函数即可, 例子以及参数: new Tab({ triggerType: "click",// 触发切换的事件类型 click,mou
详见 阮一峰的文章:CSS 变量教程
在每个列表里放入不可见的 input 输入框,然后选项卡按钮设置label元素,通过 label for 属性与input输入框的 id 相关联。
使用webpack封装打包一个原生JavaScript弹出框组件(popup)实践
在网页中使用iframe 标签嵌入另一个网页,将margin padding 设为0 后 还是存在此问题,最后发现 iframe标签是 内联元素 ,将iframe 标签设置为 display:block 即可修复 关于 内联元素为什么出现白边,参考:从 image 底部白边初识 line-hei
容器元素定义了:before 用于显示一些提示类的图标,因为需要对容器内超出范围的内容做处理,添加了overflow:hidden,但是 导致了 :before 伪元素也被裁掉了. ::before 会为当前元素创建一个子元素作为伪元素。常通过 content 属性来为一个元素添加修饰性的内容。
1.link是HTML标签,@import是css提供的。 2.link引入的样式页面加载时同时加载,@import引入的样式需等页面加载完成后再加载。 3.link没有兼容性问题,@import不兼容ie5以下。 4.link可以通过js操作DOM动态引入样式表改变样式,而@import不可以。
图片懒加载的两种实现方式监听滚动事件和IntersectionObserver