如何使用CSS制作首字母大写字母

前端之家收集整理的这篇文章主要介绍了如何使用CSS制作首字母大写字母前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想用< span>来制作我的第一封信.在首都.但是当我使用时:在此之前,大写不起作用.
span { display:inline-block; color:#66a400; }
span:first-letter { text-transform:capitalize; }
span:before { content:"-"; padding:0 2px; }

<span>my first word</span>

我需要如下所示

- My first word

解决方法

您可以使用:after而不是:before并将其浮动到左侧:
span {
  display: inline-block;
  color: #66a400;
}
span:first-letter {
  text-transform: capitalize;
}
span:after {
  content: "-";
  padding: 0 2px;
  float: left;
}
<span>my first word</span>

猜你在找的CSS相关文章