伪元素控制首行文字或字母的样式
本文最后更新于 679 天前,其中的信息可能已经有所发展或是发生改变。

定义和用法

定义

:first-line 伪元素向文本的首行添加特殊样式。

这个伪元素用于设置元素中的第一行文本的样式,而不论该行出现多少单词。

:first-line 只能与块级元素关联。可以应用到首字母的属性是有限的。

注释:下列属性应用于 :first-line 伪元素:

  • font 属性
  • color 属性
  • background 属性
  • word-spacing
  • letter-spacing
  • text-decoration
  • vertical-align
  • text-transform
  • line-height
  • clear

语法

p:first-line{
    font-size: 26px;
    font-weight: 900;
    color: red;
}

效果预览

基础效果:

这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字

welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing

添加样式效果:

这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字这是一段测试文字

welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing welcome to beijing

标题:伪元素控制首行文字或字母的样式
地址:https://xiaodongxier.com/241.html
作者:王永杰
暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇