摘要：子向父方式1：通过props,如例子中子组件test1.vue向父组件App.vue传值 App.vue代码 test1.vue代码 效果图 子向父方式2：通过$parent App.vue代码： test1.vue代码： 效果图： 子向父方式3:通过emit App.vue代码 test1.vue 阅读全文

摘要：1.利用 CSS 的伪类中的content属性获取attr中的信息 效果图：鼠标放上去出现提示 css代码： html代码： 2.实现带边框的三角形,利用伪类实现 比如弹框中的这种效果: css代码: html代码 阅读全文

摘要：用到的知识点： E:checked:单选或复选框被选中 E ~ F: 选择后面的兄弟节点们:选择后面的兄弟节点 E::after,E::before: 伪元素选择器 在匹配E的元素后面(前面)插入内容 css代码： html代码： 效果图： 阅读全文

摘要：技术要点：主要运用伪类选择器:checked，设置单选或复选按钮选中时的样式，加号'+'相邻兄弟选择器，选中后面的兄弟节点 单选框样例： css代码：background-clip规定背景的绘制区域，值为content-box表示背景被裁剪到内容框 html代码： 效果图： 复选框样例： css: 阅读全文

摘要：方式1：伪类+transform实现，主要用transform中的scale缩放，缩放默认中心点是以x,y轴的50%处，因此需要用transform-origin调整中心点 html代码： css代码： 效果图： 阅读全文

摘要：1.通过父元素overflow:hidden,缺点：超出部分隐藏，不推荐使用 效果： 方式2：添加空标签并设置clear:both，缺点是额外添加空标签，不推荐使用 方式3：通过伪类添加，既不会隐藏超出部分，又不多空标签，推荐使用 阅读全文

摘要：方式1：flex布局,display:flex;align-items:center 效果如下： 方式2：position+margin 效果图：与上面一样 方式3：如果不知道具体高度，通过position+transform 效果图： 方式4：display:table-cell+vertical 阅读全文

摘要：对于页面有很多静态资源的情况下（比如商品图），为了节省用户流量和提高页面性能，可以在用户浏览到当前资源的时候，再对资源进行请求和加载，不仅可以减轻服务器的压力，而且用户体验也好一点 方式1：通过scroll监听滚动，getBoundingClientRect获取位置信息,（这种方式缺点是经常计算元素 阅读全文