hooyantsing's Blog

P20_15_文本伪类操作技巧

字数统计: 98阅读时长: 1 min
2020/03/24

P20 15 文本伪类操作技巧

对文章的第一个字/第一行的控制

::first-letter 第一个字

::first-line    第一行

870159f70883f5bd7fae702e1a9d1e0b.png

前面/后面追加

::before 前面追加

::after    后面追加

1
2
3
span::after{
    content:"com";
}

前面:

b9ef036f432cd408e2ab926977e4727b.png

后面:

9f5de1bac88c00f446a7028a0b648ac7.png

妙用:

c22676417dbbaca8a1c7c9cb6e4de4bb.png

**

**

input边框消失

1
2
border:none;
outline:none;

给控件加上悬停小手

类似于a标签的悬停小手

1
cursor:pointer;
CATALOG