2022年2月2日
30秒学会 CSS 片段 – Hide empty elements
Hides elements with no content. Use the :empty pseudo-class to select elements with no content.
30秒学会 CSS 片段
2020年6月10日
30秒学会 CSS 片段 – 禁止选择文本
使文本无法被选择。 user-select: none 指定文本不能被选择. 如果你不想让用户复制网站的内容，这不是一个完美的方法。用户仍然可以通过禁用 CSS 或者开发人员工具来轻松达到目的。
2020年6月9日
30秒学会 CSS 片段 – 固定宽高比
假定元素的宽度可变，它的高度会自动适应 (比如其 width 和 height 可以保持固定的宽高比). 在伪元素 :before 上设置 padding-top 可以使元素的高度与宽度成一定的比例。...
2020年5月31日
30秒学会 CSS 片段 – 圆
只用 CSS 来创建圆。 可以使用 border-radius: 50% 弯曲元素的边缘来创建圆。 因为圆在任一点上都的半径都相同，所有元素的 width 和 height 必须一样，否则所创建的就是...
2020年5月16日
30秒学会 CSS 片段 – Zebra striped list
Creates a striped list with alternating background colors, which is useful for differentiating sibli...
2020年5月11日
30秒学会 CSS 片段 – Shape separator
Uses an SVG shape to separate two different blocks to create more a interesting visual appearance co...
2020年5月9日
30秒学会 CSS 片段 – Transform centering
Vertically and horizontally centers a child element within its parent element using position: absolu...
2020年4月5日
30秒学会 CSS 片段 – Truncate text
If the text is longer than one line, it will be truncated and end with an ellipsis …. overflow: hidd...
2020年3月26日
30秒学会 CSS 片段 – Evenly distributed children
Evenly distributes child elements within a parent element. display: flex enables flexbox. justify-co...
2020年3月23日
30秒学会 CSS 片段 – Gradient text
Gives text a gradient color. background: -webkit-linear-gradient(…) gives the text element a gradi...