前端布局

使用 justify-content: flex-start + 动态边距（推荐） 核心思路：改用左对齐布局，通过设置卡片间距并清除每行最后一个卡片的右边距。 优点： 兼容所有浏览器 两个卡片相邻显示

使用flexbox布局使用flexbox布局使用flexbox布局使用flexbox布局使用flexbox布局

要使用 CSS 实现三个元素分别左、中、右对齐，并且每个元素内部有上下居中排列的两个文字，可以使用 flexbox 布局来完成。这种布局方式非常灵活，能够很好地控制元素的位置和对齐方式。 示例代码 解

使用querySelectorAll 获取的NodeList NodeList 对象是节点的集合，通常是由属性，如Node.childNodes 和 方法，如document.querySelecto

1 前言 原文链接：https://blog.51cto.com/youthfighter/5461161 在​​web​​开发的过程中，或多或少都会遇到大列表渲染的场景，例如全国城市列表、通讯录列表

滚动条默认是隐藏的只有鼠标移上去才会显示滚动条默认是隐藏的只有鼠标移上去才会显示滚动条默认是隐藏的只有鼠标移上去才会显示

物理像素&物理像素比 物理像素点指的是屏幕显示的最小颗粒，是物理真实存在的。这是厂商在出厂时就设置好了,比如苹果6\7\8 是 750* 1334 物理像素比就是屏幕的分辨率，分辨率越高，显示越清楚，

在2560*1440的笔记本电脑上实际打印出来window.screen.width是1707,window.screen.height是960 (因为笔记本缩放了150%) 在2560*1600的笔

浏览器分辨率测试     浏览器分辨率测试是非常常见的一种兼容性测试。今天我就以Google Chrome 为例，来汇总整理一下其手动测试常用的工具，如下所示： 1.1 Chrome自带兼容性工具  

:popper-append-to-body="false" popper-class="select-popper"

这个是项目中遇到的 一个小问题 ，在此记录一下，我们项目有个地方用到了可编辑的div，即contenteditable=“true”,但是在chrome下有个问题，就是在没有任何内容的情况下聚焦时没有

示例如下： 我定义了一个外层红色盒子绝对定位居中，又定义一个子元素蓝色盒子绝对定位，我需要的情况 但是实际展示是 审查元素发现，定位的蓝色盒子被裁减了 如果我们将容器b盒子的定位属性删除，c盒子又能正

input输入框只显示下划线input输入框只显示下划线input输入框只显示下划线input输入框只显示下划线

js控制滚动条让元素往左滑动（横向滚动原理、scrollLeft）js控制滚动条让元素往左滑动（横向滚动原理、scrollLeft）

实现思路 按照设计稿的尺寸，将px按比例计算转为vw和vh，转换公式如下 话不多说，上代码 css 方案 - sass util.scss 路径配置只需在vue.config.js里配置一下utils

## 问题： 正方形和文字对不齐 ## 原因： 当元素没有内容时，是元素的下边框和文字对齐 ## 解决办法： ``` align-items:basic-baseline; ```

如何让前端浏览器不进行缓存？如何让前端浏览器不进行缓存？如何让前端浏览器不进行缓存？如何让前端浏览器不进行缓存？

注意：阴影颜色直接吸取设计稿中的阴影颜色即可；注意：阴影颜色直接吸取设计稿中的阴影颜色即可；注意：阴影颜色直接吸取设计稿中的阴影颜色即可；

前端在 CSS 中最多显示 2 行文字，可以使用 overflow: hidden 和 text-overflow: ellipsis 属性，并设置一个高度限制。 这样，如果文本需要更多的行数才能完全

1、什么是H1标签 #网站优化#H1标签是（H1-H6）标题标签中的第一个，（H1-H6）是对文本标题进行标注的一种标签，以标签<h1>、<h2>、<h3>到<h6>依此显示重要性的递减。制作<h>标