css伪元素之:first-letter

最新推荐文章于 2020-11-30 15:24:35 发布
原创 最新推荐文章于 2020-11-30 15:24:35 发布 · 225 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#伪元素 #:first-letter

本文介绍了 CSS 中 :first-letter 伪元素的应用及可设置的样式属性，包括字体、颜色、背景等，并提供了进一步的学习资源链接。

    :first-letter

 

       ------- 向文本的第一个字母添加特殊样式。

 

       下列属性应用于:first-letter伪元素：

 

  • font
  • color
  • background
  • margin
  • padding
  • border
  • text-decoration
  • vertical-align(仅当float为none的时候)
  • text-transform
  • line-height
  • float
  • clear

 

扩展阅读：

 

http://www.w3cschool.cn/pr_pseudo_first-letter.html

 

 

Java 创建编写 map版通讯录
ForeverNagisa的博客
01-25 1055
Map版通讯录
::first-letter ::first-line
扬 帆 起 航ing
08-07 514
CSS的伪元素::first-letter与::first-line分别是用来设置占一行的元素(display:block，如默认的div与p)内的首个字符的样式及第一行的样式，并且他们不会互相干扰，比如     p::first-letter{ font-size:4em; color:Black;}   p::first-line{font-size:smaller; color:Red...
深入::first-letter的研究
tian361zyc的博客
05-22 1459
:first-letter 伪元素
CSS伪元素选择器
歪脖先生的博客
01-11 1423
伪元素选择器 伪元素选择器，并不是基于真正的元素，而是基于元素当前所具有的特性来选取元素。由于这些元素本身并不存在于文档中，只是基于元素的抽象，因此称作伪元素。 伪元素选择器是CSS 中已经定义好的选择器，不能由用户随便起名，只能按CSS规定的标准格式使用。语法格式为： 选择器:伪元素 { 属性: 值 } 伪元素选择器在CSS中一直存在，但CSS3对伪元素进行了一定的调整，
CSS之first-letter 和first-line
qq_37852483的博客
03-28 1196
first-letter 和first-line只能使用在块级元素注意了 <html> <head> <style type="text/css"> span::first-line { float:left; width:0.7em; font-size:400%; font-family:algerian,courier; line-height:80%; ...
伪元素:first-letter注意事项
Wangdanting123的博客
10-10 1595
伪元素:first-letter注意事项
IE6无法识别伪对象:first-letter和:first-line解决方法
12-13
在网页设计和开发中，IE6（Internet Explorer 6）作为一个较旧的浏览器版本，存在很多兼容性问题，其中就包括对CSS伪对象`:first-letter`和`:first-line`的不支持。这两个伪对象在现代浏览器中是常用的设计工具，...
CSS first-letter伪类元素的特点
09-25
`CSS first-letter`伪类元素是CSS中一种特殊的选择器，用于选中并样式化文本块的第一个字母。这个伪类可以应用于段落、标题等包含文本的元素，以实现特定的排版效果，如首字下沉或首字母加粗等。然而，它存在一些...
css 控制first-letter伪类的背景
09-25
此外，需要注意的是，`first-letter`伪类仅适用于块级元素的第一个字母，对于内联元素或行内块元素，可能需要结合其他CSS技术来实现类似的效果。 总结，CSS的`first-letter`伪类是一个强大的工具，它允许开发者对...
tailwindcss-pseudo-elements:TailwindCSS插件，添加伪元素的变体
03-07
TailwindCSS插件，添加伪元素的变体（ ::before ， ::after ， ::first-letter等）。 用法 安装 NPM npm install tailwindcss-pseudo-elements --save-dev 纱 yarn add tailwindcss-pseudo-elements -D 配置 const...
CSS first-letter实现首字下沉
09-25
本文将通过一系列实验和分析，详细介绍如何使用CSS的`:first-letter`伪元素结合浮动属性实现首字下沉，并探讨为何在某些情况下需要清除浮动。 #### 基本概念回顾 首先，我们需要了解`:first-letter`的基本用法。`:...
:first-letter和:first-line
weixin_47124862的博客
11-30 1722
一、:first-letter选择器 在css中，我们可以使用该选择器，选中元素内容中的第一个字或者字母。 语法：元素:first-letter{} 举例： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
map 容器小例（hash map）
letterwuyu的专栏
12-09 418
//导入两个文件t1存放映射规则，t2存放内容，将t2中的内容通过t1映射出来 /* t1 brb be right back k okay? y why r are u you pic picture thk thanks! 18r later */ /* t2 where r u y dont u send me a pic k thk 18r */ #in
first-letter--一个空格的问题
11-27 147
今天一个朋友问我怎么让段落首字母变大,我首先想到的是使用伪类 first-letter 来解决这个问题,但是我发现ie6下不兼容这个属性,在无意间一个空格解决了这个问题 ,这个属性使用的时候一定要在first-letter和{直接多加一个以上空格.........这个问题到底是什么导致,那位大侠知道个我说说 <style> p{line-heigh...
python tornade 表单和模板
u014033218的专栏
09-22 902
在第一章中，我们学习了使用Tornado创建一个Web应用的基础知识。包括处理函数、HTTP方法以及Tornado框架的总体结构。在这章中，我们将学习一些你在创建Web应用时经常会用到的更强大的功能。 和大多数Web框架一样，Tornado的一个重要目标就是帮助你更快地编写程序，尽可能整洁地复用更多的代码。尽管Tornado足够灵活，可以使用几乎所有Python支持的模板语言，Tornado自身也
css first-letter实现首字(字母)下沉效果
weixin_33895516的博客
10-10 452
css 首字下沉效果原理 首字下沉主要使用到css的first-letter伪元素，然后配合使用font-size和float来设置文字的样式即可实现。 first-letter选择器选取指定元素文本内容的第一个字母，即用于设置第一个字母的css样式。 下面是一个简单的first-letter实例 <!DOCTYPE HTML> <html> &l...
css伪元素之:after
Focus-Fe
01-14 450
   :after               ----------   伪元素在元素之后添加内容   在元素内容的最后面插入生成内容，默认伪元素是行内元素，但是可以设置display 所有主流浏览器都支持:after      实例：        .test:before{ content:'{' }          扩展阅读：      ...
css之background-attachment属性
Focus-Fe
01-13 419
CSS  background-attachment属性   ------设置背景图像是否固定或者随着页面的其余部分滚动。   默认值： scroll 继承性： no 版本： CSS1 JavaScript 语法： object.style.backgroundAttachment="fixed"   可能的值 值 描述 sc...
css之list-style属性
Focus-Fe
01-07 395
  CSS list-style 属性     定义和用法 list-style 简写属性在一个声明中设置所有的列表属性。 可以按顺序设置如下属性：   list-style-type list-style-position list-style-image 1.CSS list-style-type 属性                 -----------...
CSS样式表基础：text-indent属性详解
此外，`::first-line`伪对象选择符可以专门设置段落的第一行样式，`::first-letter`伪对象则用于设置段落的第一个字符样式，如首字母下沉。 在CSS样式表中，样式规则的优先级是关键。根据层叠规则，样式可以按照从...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值