gpt4 book ai didi

html -::first-letter 伪元素的首字母属性不起作用

转载 作者:行者123 更新时间:2023-12-04 15:28:18 25 4
gpt4 key购买 nike

这个问题在这里已经有了答案:





Css initial-letter workaround

(1 个回答)


去年关闭。




这是我的代码:

p::first-letter {
color: red;
font-size: 200px;
initial-letter: 3;
-webkit-first-letter: 3;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="style.css" />
<title>Document</title>
</head>
<body>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Veritatis
deserunt vero ipsam dolores aut excepturi cumque non perferendis tempore
ea? Enim saepe corrupti voluptates? Neque non nostrum, maiores facere nam
labore dignissimos quis est ea enim deleniti molestias consectetur velit
amet ad repellendus explicabo assumenda laudantium magnam eum numquam
praesentium voluptates odit iure. Explicabo, ad? Blanditiis quaerat
accusamus, pariatur animi sit, illum laborum placeat earum expedita ad
maiores est! Nisi odit distinctio, hic, nihil iure eum maxime mollitia
nostrum aperiam ipsa minus cumque harum. Cupiditate, sunt nihil. Fugit,
sed odit, iusto nisi culpa facilis quis ratione eum pariatur ex maiores!
Est atque amet, at tempore error earum ab aspernatur placeat vel quos
animi quas minima, praesentium voluptatum nemo autem quasi nam maxime
totam magnam ad ullam. Commodi corrupti soluta repudiandae totam porro
nihil dolorum quaerat reprehenderit assumenda repellat officia aliquid
similique autem tempore, ducimus non. Obcaecati harum doloremque natus
totam expedita, delectus quis, nisi dignissimos saepe, maiores debitis
cupiditate ipsam enim! Optio eligendi possimus ea fugit eum odit
accusantium maxime, distinctio maiores dolorum atque, vero quia culpa
provident, voluptas earum voluptatum nam impedit ex nesciunt deserunt?
Laboriosam in dolores blanditiis eveniet necessitatibus voluptate delectus
cum, error modi officia, itaque consequuntur non sit quis, quibusdam
veritatis rerum corrupti! Deserunt, expedita nesciunt laudantium quas,
iusto natus vitae, eveniet voluptatem voluptas mollitia quam dicta
quisquam. Exercitationem eveniet, rem alias obcaecati officiis beatae et
laudantium perspiciatis similique nesciunt, error magni nemo?
</p>
</body>
</html>


为什么 initial-letter: 3;不管用?我错过了什么?我正在使用谷歌浏览器。

非常感谢

最佳答案

这是一个很好的问题。

不幸的是,此时(2020 年 5 月),CSS 属性 initial-letter尚不支持任何浏览器。

看:

  • https://caniuse.com/#feat=css-initial-letter


  • 一旦支持,请注意 initial-letter可能需要第二个(可选)值:
    initial-letter: 3 2;

    在哪里:
  • 第一个值表示 initial-letter 的行数占据;和
  • 第二个值表示 initial-letter 到的行数沉了。

  • 如果省略第二个值,则假定它与第一个值相同。

    看:
  • https://developer.mozilla.org/en-US/docs/Web/CSS/initial-letter


  • 示例(不起作用,因为尚不支持):

    p::first-letter {
    color: red;
    -webkit-initial-letter: 3 2;
    initial-letter: 3 2;
    }
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Veritatis deserunt vero ipsam dolores aut excepturi cumque non perferendis tempore ea? Enim saepe corrupti voluptates? Neque non nostrum, maiores facere nam labore dignissimos quis est ea enim deleniti molestias consectetur velit amet ad repellendus explicabo assumenda laudantium magnam eum numquam praesentium voluptates odit iure. Explicabo, ad? Blanditiis quaerat accusamus, pariatur animi sit, illum laborum placeat earum expedita ad maiores est! Nisi odit distinctio, hic, nihil iure eum maxime mollitia nostrum aperiam ipsa minus cumque harum. Cupiditate, sunt nihil. Fugit, sed odit, iusto nisi culpa facilis quis ratione eum pariatur ex maiores! Est atque amet, at tempore error earum ab aspernatur placeat vel quos animi quas minima, praesentium voluptatum nemo autem quasi nam maxime totam magnam ad ullam. Commodi corrupti soluta repudiandae totam porro nihil dolorum quaerat reprehenderit assumenda repellat officia aliquid similique autem tempore, ducimus non.</p>

    关于html -::first-letter 伪元素的首字母属性不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61810938/

    25 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com