lq099526的专栏

安装 Tailwind CSS步骤，失效，样式不加载

important > style > #id > .class > 元素选择器(div,::after) > @import。容器伪元素宽高是 200% ，边框为 1px ，然后缩小元素为50%，视觉上实现 0.5px。定位 + 伪元素 + transfrom缩放（scale）方式二：flex/grid + margin。方式三：父容器 table-cell。方式四：定位 + translate。方式一：flex/grid 布局。

CSS 变量（CSS variable）又叫做“CSS 自定义属性”，通过声明CSS变量来设置通用的颜色、字号等，实现统一页面风格，方便后期维护，减轻开发量，更高的性能，更好的压缩文件。

防御性编程是一种细致、谨慎的编程方法（习惯）。我们在写代码时常会有“以防万一”的心态，把以防万一有可能出现的情况提前考虑进去，规避以免以防万一出现带来的问题。 应用防御性编程技术，你可以侦测到可能被忽略的错误，防止可能会导致灾难性后果的“小毛病”的出现，在时间的运行过程中为你节约大量的调试时间。...

1. css 一行文本超出... overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 2.多行文本超出显示... display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; // 几行 overflow: hidden;

https://blog.youkuaiyun.com/xiaole0313/article/details/103286246?utm_medium=distribute.pc_relevant_download.none-task-blog-baidujs-2.nonecase&depth_1-utm_source=distribute.pc_relevant_download.none-task-blog-baidujs-2.nonecase

（1）旋转效果 @keyframes rotate { 0% { transform: translate(-50%,-50%) rotate(0deg); } 100% { transform: translate(-50%,-50%) rotate(360deg); } } animation: rotate 3s linear infinite; （2）上下移动效果 @keyframes move{ from{transform:translate(0..

/*隐藏滚动条*/ &::-webkit-scrollbar { display: none; } div::-webkit-scrollbar滚动条整体部分 div::-webkit-scrollbar-thumb滚动条里面的小方块，能上下左右移动 div::-webkit-scrollbar-track滚动条的轨道 div::-webkit-scrollbar-button滚动条的轨道的两端按钮，允许通过点击微调小方块的位置 div::...

.clearfix{ overflow:hidden; _zoom:1; &:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } }