css3
0 人感兴趣 · 94 次引用
- 最新
- 推荐
css3 多行文本多行文本缩略点击更多展开显示全部
比如我要实现如下效果:比如我要实现如下效果:数据集名称展示一行,超出自动省略,末尾增加编辑icon。点击编辑的icon,换成input 输入框数据集描述最多展示三行
![https://static001.geekbang.org/infoq/70/701aafdce20e9172d0ad763f972909db.webp?x-oss-process=image%2Fresize%2Cw_416%2Ch_234](https://static001.geekbang.org/infoq/70/701aafdce20e9172d0ad763f972909db.webp?x-oss-process=image%2Fresize%2Cw_416%2Ch_234)
![https://static001.geekbang.org/infoq/0f/0facb34cb4a2a46749f62e6c731c6f1f.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234](https://static001.geekbang.org/infoq/0f/0facb34cb4a2a46749f62e6c731c6f1f.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234)
CSS 小技巧之圆形虚线边框
基于伪元素设置锥形渐变 `repeating-conic-gradient`并配合`-webkit-mask-composite`实现自定义圆形虚线边框的效果。
![https://static001.geekbang.org/infoq/29/298c2e89e42a01b4c05f37407b048018.gif?x-oss-process=image%2Fresize%2Cw_416%2Ch_234](https://static001.geekbang.org/infoq/29/298c2e89e42a01b4c05f37407b048018.gif?x-oss-process=image%2Fresize%2Cw_416%2Ch_234)
避免使用 CSS @import 影响页面加载速度
CSS`@import`可以用来加载其他CSS样式的便捷方式,但是使用它也会使网站的资源呈现变得更慢,导致网站呈现的时间更长
![https://static001.geekbang.org/infoq/22/22823a9886adb96f130111938900f480.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234](https://static001.geekbang.org/infoq/22/22823a9886adb96f130111938900f480.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234)
基于 CSS mask 和 clip-path 实现切角的技巧
本文将使用CSS mask和clip-path来切元素的四个角!使用多种技巧可以从任何元素的角切割不同的形状。
css 学习笔记 3
font-size属性用于设置字号,该属性的值可以使用相对长度单位,也可以使用绝对长度单位。其中,相对长度单位比较常用,推荐使用像素单位px,绝对长度单位使用较少。
![https://static001.geekbang.org/infoq/a5/a5580dfa3f0a19029dd662a5986e67a5.webp?x-oss-process=image%2Fresize%2Cw_416%2Ch_234](https://static001.geekbang.org/infoq/a5/a5580dfa3f0a19029dd662a5986e67a5.webp?x-oss-process=image%2Fresize%2Cw_416%2Ch_234)
Flex 布局教程: 语法篇
前言:在现在网页中,我们不仅仅局限于PC端,我们也在适应移动端进行项目的开发,那么传统的布局方式又难以实现我们的移动端,所以我们来接触Flex布局来进行了解。