gpt4 book ai didi

html - 阿拉伯文本阴影问题

转载 作者:行者123 更新时间:2023-12-04 00:54:22 26 4
gpt4 key购买 nike

Arabic text trouble

<html>
<body style="font-size: 36px; background: #4488ff; color:#fff;">
<div>
<span>أ</span><span>ظ</span><span>ه</span><span>ر</span><span> </span><span>ا</span><span>ل</span><span>ك</span><span>ل</span>
</div>
<div style="text-shadow:-1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">
<span>أ</span><span>ظ</span><span>ه</span><span>ر</span><span> </span><span>ا</span><span>ل</span><span>ك</span><span>ل</span>
</div>
</body>
</html>

我注意到跨越阿拉伯语的文本有间隙(在 Chrome\FireFox 上测试过)。好吧,我需要跨越文本,但我认为不应存在间隙,无论如何我可以解决这个问题吗?

最佳答案

另一种选择是使用阴影过滤器直到文本笔画起作用:

可能的例子:

span:nth-child(3) {
color: gold;
}

body {
font-size: 80px;
background: #4488ff;
color: #fff;
margin: auto;
}

html {
display: flex;
min-height: 100vh
}
<div style="filter:
drop-shadow(1px 1px 0px #000)
drop-shadow(-1px -1px 0px #000)
drop-shadow(-1px 1px 0px #000)
drop-shadow(1px -1px 0px #000)
">
<span>أ</span><span>ظ</span><span>ه</span><span>ر</span><span> </span><span>ا</span><span>ل</span><span>ك</span><span>ل</span>
</div>

关于html - 阿拉伯文本阴影问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63875569/

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