本文记录了我在滴滴从事H5开发工作，到目前为止的这一年里，我所遇到的一些比较经典的问题，主要是样式上的，希望能帮助到大家！

前一阵做需求时，有个小功能实现起来废了点脑细胞，觉得可以记录一下。 产品的具体诉求是：用户点击按钮进入详情页面，详情页内的卡片标题内容过长时，标题的前后两端正常展示，中间用省略号...表示，并且鼠标悬

瀑布流虚拟列表前置篇，分析小红书瀑布流特点，实现不定高卡片的瀑布流组件并且实现触底加载更多以及响应式布局

Grid 布局是一种新型CSS布局方式，特点为二维布局，他比较擅长将一个页面划分为几个主要区域，本文主要介绍Grid布局的基本使用情况。

前端开发肯定都接触过伪类（pseudo class） 和伪元素（pseudo element） ，但是这两个概念特别容易搞混，不要怕，今天就带领大家攻克这个技术难点。

持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第6天。 Grid布局 即 网格布局可以将一个页面的div或其他html标签划分为几个主要区域...

`CSS` 网格布局是一种基于二维网格的布局系统，与过去的任何网页布局系统相比，它完全改变了我们设计用户界面的方式。图文并茂！一次性搞懂 Grid 布局，实现“布局自由”~

概念 CSS网格是一个用于web二维布局系统。利用系统，你可以把内容按照行与列的格式进行排版。另外，网格还能非常轻松地实现一些复杂的布局 利用网格布局可以轻松地进行单元格合并、格子与格子之间的间距 g

在项目中，经常会碰到背景色不确定的场景，为了让内容文字足够清晰可见，文字和背景之间需要有足够的对比度。换句话说，当背景是深色时，文字为白色，当背景是浅色时，文字为黑色，就像这样： 通常这种情况，大家可