Html 倾斜字体被文本对齐切断：右
如果您有这些大的“倾斜”字体（不确定术语），您的不透明度小于1，并且您使用的是文本对齐：右，文本的结尾将被截断。我还发现，在OSX版本的Safari中，即使不透明度为1，端点也不会渲染。在其他任何地方，似乎只有当不透明度小于1时才会出现这种情况。这似乎只有在将文本向右对齐时才会发生 我在JSFIDLE中重新创建了这个问题： 守则：Html 倾斜字体被文本对齐切断：右,html,css,fonts,text-align,Html,Css,Fonts,Text Align,如果您有这些大的“倾斜”字体（不确定术语），您的不透明度小于1，并且您使用的是文本对齐：右，文本的结尾将被截断。我还发现，在OSX版本的Safari中，即使不透明度为1，端点也不会渲染。在其他任何地方，似乎只有当不透明度小于1时才会出现这种情况。这似乎只有在将文本向右对齐时才会发生 我在JSFIDLE中重新创建了这个问题： 守则： <head> <title>Test</title> <link href='http://fonts.g
<head>
<title>Test</title>
<link href='http://fonts.googleapis.com/css?family=Playball' rel='stylesheet' type='text/css'>
<style>
.box {
background-color: lightblue;
width: 500px;
font-family: 'Playball', cursive;
text-align: right;
padding-right:30px;
}
.box h1 {
opacity: 0.5;
font-size:48px;
font-weight:400;
}
</style>
</head>
<body>
<div class="box">
<h1>Hello world</h1>
</div>
</body>
试验
.盒子{
背景颜色：浅蓝色；
宽度：500px；
字体系列：“Playball”，草书；
文本对齐：右对齐；
右侧填充：30px；
}
.框h1{
不透明度：0.5；
字体大小：48px；
字体大小：400；
}
你好，世界
<head>
<title>Test</title>
<link href='http://fonts.googleapis.com/css?family=Playball' rel='stylesheet' type='text/css'>
<style>
.box {
background-color: lightblue;
width: 500px;
font-family: 'Playball', cursive;
text-align: right;
padding-right:30px;
}
.box h1 {
opacity: 0.5;
padding-right:10px;
font-size:48px;
font-weight:400;
}
</style>
</head>
<body>
<div class="box">
<h1>Hello world</h1>
</div>
</body>
试验
.盒子{
背景颜色：浅蓝色；
宽度：500px；
字体系列：“Playball”，草书；
文本对齐：右对齐；
右侧填充：30px；
}
.框h1{
不透明度：0.5；
右边填充：10px；
字体大小：48px；
字体大小：400；
}
你好，世界
干杯字体有问题。我对这种类型的多种字体也有同样的问题，但我会再尝试几种，看看这是不是真的。代码和小提琴没有说明问题，因为它们显然有一种解决方法，一种正确的填充。哦，他们在Chrome和IE中证明了这一点，而不是在Firefox中。@JukkaK.Korpela:不，填充物是不相关的，只是让它更容易看到。-两种不同不透明性的屏幕截图。最后一封信的结尾被剪掉了。编辑：哦，是的，我想应该提到浏览器：P对不起，谢谢，就是这样。这里肯定有解决办法（我想改一下颜色的alpha）。我仍然对为什么会发生这种情况感兴趣。我能得到的唯一解释是，如果“不透明度”设置为1，浏览器会忽略它并在没有它的情况下运行。如果不使用不透明度，它也会显示全文。尝试选择一个斜体文本，然后您会注意到选择也会剪切最后一个字符的最后一部分。所以我的猜测是“不透明度”只显示可选择的文本。如果你再次添加不透明度并尝试选择文本，你会注意到它选择的文本正好是它被截断的位置。希望这能部分解释：）在上面的主题上再补充一点。如果不想使用填充解决方案，可以使用另一个。在文本后添加一个空格，使其看起来像这样：
helloworld