::first-letter 也设置第一个字符的样式

2024-02-19

我有这样的文字:

p::first-letter {
  color: red;
}
<p>"Welcome!"</p>

但后来我意识到"定型了。

我尝试使用::before但这也不起作用:

p::first-letter {
  color: red;
}

p::before {
  content: '"';
}
<p>Welcome!"</p>

我怎样才能设法只设置第一个字母的样式(在干净的代码中)?


simply float第一个字符和用途:after not :before

p::first-letter {
  color: red;
}

p::after {
  content: '"';
  float:left;
}
<p>Welcome!"</p>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

::first-letter 也设置第一个字符的样式 的相关文章

  • Shift+Enter 按钮用于提交表单

    我想使用 Shift Enter 按钮提交表单 而不是简单地按 Enter 按钮 请帮助我 如果您仍然想这样做 尽管这会带来可用性问题 form keydown function e if e keyCode 13 e shiftKey W
  • 如何左对齐 Bootstrap 3 下拉菜单?

    在上图中 MenuItems 与 MyMenu 的右侧对齐 我需要将 MyMenu 的 MenuItems 左对齐 我的意思是它必须与 MyMenu 的左边缘对齐 我尝试使用 pull left 和 pull right 类 例如 ul c
  • 如何使用 CSS 绘制一个向左的三角形?

    我已经很久没有建造这个向上的三角形了 我怎样才能改变我的 CSS 使角指向左边 http jsfiddle net 3sP8q http jsfiddle net 3sP8q left corner width 0 height 0 bor
  • 为什么 z-index 对 div 不起作用?

    我试图让我的页脚显示在页脚背景的顶部 但 z index 似乎不起作用 有人看出它有什么问题吗 http jsfiddle net f2ySC http jsfiddle net f2ySC 你必须明确地定义position财产 foote
  • 角度斜线被编码

    我和这个人有同样的问题 angularjs slash after hashbang gets encoded https stackoverflow com questions 17530924 angularjs slash after
  • 对于跨域 XHR 丢弃 cookie 不是更简单吗?

    在进行网络开发时 我一直在与奇怪的限制作斗争 其中之一是 AJAX 请求的同源限制 我问自己 在创建请求时丢弃 cookie 而不是阻止对跨域资源的请求是否会更简单 以避免滥用 AJAX 请求的身份验证凭据 浏览器会话 Cookie 是一种
  • 如何使用 JavaScript 提高音频加载速度?

    我已经创建了播放代码 mp3使用 JavaScript 文件 但该文件在 Android 上播放需要很长时间 我想在点击文本图像后快速播放声音 如何提高 Android 的加载速度 我的 JavaScript 代码 if window au
  • 为什么 HTML 5 没有内置可编辑组合框或本地菜单? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 使用 AppleScript 单击 safari 网页按钮

    我想弄清楚如何单击网页中的按钮 例如 点击谷歌网页中的 手气不错 按钮 这是我尝试过的 tell application Safari make new document with properties URL https www goog
  • 我应该使用媒体查询来定位哪些设备/推荐尺寸?

    我是响应式网页设计的新手 并且感到困惑 因为对于使用哪些媒体查询以及要定位哪些设备有不同的偏好 有标准吗 我想定位 iPhone iPad 和其他流行设备 我在网上找到了这个 Smartphones portrait and landsca
  • 差异:查看页面源代码与在 Firebug 中查看

    当我查看页面的页面源时 例如 http my sa ucsb edu public curriculum coursesearch aspx http my sa ucsb edu public curriculum coursesearc
  • CSS 背景在 iOS 中拉伸以填充高度,但滚动上有空白

    这个 CSS 让我的背景在 iOS 中填充 100 的屏幕高度 但有一个小问题 当你向下滚动时 最初有空白 然后当你松开手指并停止滚动时 背景图像会 调整 并填充 100再次屏幕高度的 如果您继续滚动 该问题不会在同一页面上再次出现 只是第
  • Knockout.js:有条件绑定div的title属性

    我的页面上有一个 viewModel 它保存一些设备当前状态概述的数据 到目前为止 除了一个问题之外 一切都运行良好 我需要根据 viewModel 中的另一个值设置 div 元素的 title 属性 我知道您基本上可以像这样设置 titl
  • BEM 与 SASS 和 :hover

    使用 BEM 和 SASS 声明活动 焦点 悬停状态的正确方法是什么 例如 我有这样的结构 div class card img class card image src alt div class card overlay div cla
  • 如何更改 R Markdown HTML 文档中目录的颜色和属性?

    我花了很多时间谷歌搜索这个 但似乎无法弄清楚 我正在使用 R Markdown 制作 HTML 文档 文档在这里 http rmarkdown rstudio com html document format html http rmark
  • CSS 列不会水平对齐

    我正在使用列计数来允许我的文本流入两个不同的列 但第一列的顶部 最左边 低于另一列 col moz column count 2 webkit column count 2 column count 2 div h3 Options h3
  • 容器中的等间距 div

    这是我的例子 http jsfiddle net rtCP3 62 http jsfiddle net rtCP3 62 我有 3 个 或更多 div 我想在一个容器中均匀分布 当将 Angular 与 ng repeat 一起使用时 样式
  • 在 X 轴刻度上渲染 HTML

    我想在 D3 图表的 x 轴上渲染 HTML 基本上 我希望轴上的每个标签都是到数据中另一列的超链接 我试过了 x domain data map function d return a href d Name a 但它根本不起作用 我得到
  • 在原始颜色和设置颜色之间设置动画背景

    我有带有随机初始背景颜色的 HTML 元素 我需要在原始 初始 和新元素之间对选定元素的背景颜色进行动画处理 我一直在尝试使用 keyframes blink red 0 background color initial color ini
  • JavaScript - 替换 html 字符串中的特定单词索引

    我在 JS 字符串操作方面面临着一项具有挑战性的任务 有一个 HTML 字符串 我需要在其中替换特定单词索引处的单词 单词索引是忽略 HTML 标签时单词的编号 例如 下面是 HTML 字符串 span style font family

随机推荐

  • 如何使用 DBpedia 属性构建主题层次结构?

    我试图通过遵循下面提到的两个 DBpedia 属性来构建主题层次结构 skos 更广泛的财产 dcterms 主题属性 我的目的是给这个词确定它的主题 例如 给出这个词 支持向量机 我想从中识别主题 例如分类算法 机器学习等 然而 有时我对
  • 使用 Perl 单行从文本文件中提取列:类似于 Unix cut

    我使用的是 Windows 我想使用 Perl Python 批处理等单行代码从文本文件中提取某些列 在 Unix 上我可以这样做 cut d f 1 3
  • 如何轻松地在 Git 中的多个发布分支上应用错误修复?

    我已经使用 git 进行单人开发有一段时间了 但直到现在我还没有遇到任何棘手的分支问题 而且我似乎忘记了一些基本的东西 而我在阅读实用版本后无疑 知道 这些东西使用 Git 进行控制书籍 我经常比我的网站上实际发布的内容提前几个版本 因此当
  • Hololens TCP 套接字 - Hololens 服务器的 Python 客户端

    经过几周的挫折后 我终于能够将一个字符串从 Python 客户端发送到 Hololens 服务器 代码如下并且运行完美 但是 我想知道是否有使用套接字经验的人可以帮助我修改此代码以将 openCV 网络摄像头帧 基本上只是发送图像 从 Py
  • 警告:复制捆绑资源构建阶段包含此目标的 Info.plist 文件

    我将一个项目分成两个构建 并给每个构建一个plist文件 一切正常 但我不断收到此构建警告 警告 复制捆绑资源构建阶段包含此目标的 Info plist 文件 MyApp Info plist 当我尝试构建时我得到了这个MyApp 构建第二
  • 数据库架构更新

    我正在开发一个使用本地 SQLite 数据库的 AIR 应用程序 并且想知道在分发新版本的应用程序时如何管理数据库架构更新 还考虑跳过某些版本的更新 例如 不是从 1 0 到 1 1 而是从 1 0 到 1 5 您会推荐什么技术 对于 SQ
  • WebClient DownloadFileAsync() 阻塞线程

    我正在尝试使用 WPF 和 MVVM 从我的网络服务器下载一个大文件 500 mb 因此 以下属性都绑定到某种控件 进度条 问题是 即使使用 DownloadFileAsync 应用程序仍然挂起 文件is从我的日志中可以看出 正在下载 当然
  • Apple Watch 的预处理器宏?

    我正在看苹果的Lister 适用于 Apple Watch iOS 和 OS X https developer apple com library prerelease ios samplecode Lister Listings Obj
  • Laravel 5.4:如何获取本周的记录?

    为了获取当天的所有记录 我做了 dt Carbon now dataToday Data whereDay created at dt gt day gt get 为了获取本周的记录 我尝试了以下方法 但没有成功 dataThisWeek
  • Ansible win_package 永远卡住

    我正在使用 win package 模块在 Windows 2016 服务器中安装 Nessus 但每当我执行它时 它就会永远挂起而没有响应 即使等了一个小时 也没有任何回应 我已经将 Nessus 安装程序保存在 Windows 服务器目
  • 创建全景视图android

    我想在 Android 中创建一个视图 屏幕 活动 其中的表格包含十列 由于 10 列不会在屏幕中调整宽度 不会采用可读格式 因此我一次显示 3 列 我想在应用程序中集成一个功能 如果用户在桌子上从右向左滑动 滑动 其他 3 4 列应该可见
  • 如何在网格视图中隐藏空列而不知道哪些列是空的?

    我正在使用一个 gridview 它根据下拉列表中的选择从 SQL 数据库中提取数据 源表有六列用于选择的属性 但根据选择的内容 可能会有一到六列为空 全部为空值 当该列为空时 我希望将其隐藏 以便页面不那么笨重和混乱 在过去的几天里 我一
  • 如何在 Debian Linux 系统上以非 root 身份安装 h5py (+numpy+libhdf5+...)

    我需要在 Debian Linux 系统上安装 h5py Python 模块及其所有缺少的依赖项 这项任务因以下原因而变得复杂 我在这个系统上没有任何超级用户权限 没有 sudo 没有 root 密码等 我使用的其余代码需要 Python
  • 生成 .p12 文件时没有证书与私钥匹配

    我已经成功生成了 p12文件 但我收到一条消息 如下所示 C OpenSSL Win32 bin gt openssl pkcs12 export inkey mykey key in exported pem out myfile p12
  • Xamarin.form 键盘出现时向上移动视图

    我正在尝试构建一个聊天应用程序用户界面 布局的想法非常简单 当输入栏获得焦点时 键盘会显示并 推 聊天栏 因为它是一个网格 ListView 将调整大小以适合屏幕 我更新输入栏的边距以 推 它 NSValue result NSValue
  • Qt Creator 需要设置编译器才能构建。在套件选项中配置编译器

    我已经安装了 Qt Creator5 和最新的二进制文件 但是当我运行任何程序时 它会给我这个错误 1 错误 Qt Creator 需要设置编译器才能构建 在套件选项中配置编译器 我已经在整个互联网上搜索了答案 但它不够充分并且没有帮助 请
  • icp变换矩阵解释

    我正在使用 PCL 从 ICP 获取变换矩阵 getTransformationMatrix 例如 对于没有旋转的平移运动获得的结果是 0 999998 0 000361048 0 00223594 0 00763852 0 0003605
  • 根据 nodemon 中的更改运行脚本

    是否可以使用nodemon在更改时运行脚本 是否可以做这样的事情 nodemon watch src exec yarn run my script 因此 理想情况下 我只想在发生更改时才运行脚本src folder 只需在要执行的脚本周围
  • 抑制 tbl_regression 中的置信区间脚注

    我正在使用 gtsummary 包中的 tbl regression 当从线性回归生成输出表时 有一个1CI 置信区间脚注出现在底行 有没有办法在 tbl regression 中抑制这个脚注 Use modify footnote eve
  • ::first-letter 也设置第一个字符的样式

    我有这样的文字 p first letter color red p Welcome p 但后来我意识到 定型了 我尝试使用 before但这也不起作用 p first letter color red p before content p