如何解决左边框在Safari中不起作用
| 我想通过向其添加以下类来模拟游标。 .cursor { 左边框:1px红色常亮; 右边距:-1px; 显示:内联; 职位:相对 z索引:1; } 它在Firefox中工作得很好。但是,Safari中未显示任何内容。我一直在尝试许多不同的价值观。尽管w3c声称所有主要浏览器都支持Safari,但似乎无法理解border-left。 有人可以帮我解决这个问题吗? 谢谢,解决方法
使用您的确切代码,对我来说似乎工作正常。我在这里创建了一个jsFiddle,它在Safari中显示一个红色的“插入符”。
您是否遇到特定的Safari版本?显示的jsFiddle是否适合您?它仅使用您提供的代码。
经过进一步调查,似乎跨度必须具有内容才能显示边界。我不知道确切的原因-也许Safari是“优化”空跨度,或者将其设为零高度,或类似的方法。
这似乎是WebKit问题,因为在Chrome中也会发生相同的行为。解决方法是,如果在跨度上设置高度,则似乎可行。如果我将CSS更改为:
.cursor {
border-left: solid 1px red;
margin-right: -1px;
display: block;
position: relative;
z-index: 1;
height: 1em;
}
...也就是说,在跨度上增加一个高度,然后边框会显示其是否有内容。因此,我想这是因为没有内容,WebKit没有为您的跨度提供高度,因此没有边界。确实,这是完全明智的行为。
这是您原始的jsfiddle,它增加了高度,可在Safari和Chrome中使用。
, 左边框样式适用于Safari v1.0 +
看到我刚刚在Safari 5.0.2上测试过的代码就被截断了,并且可以正常工作:
http://jsfiddle.net/DqhfJ/1/
实际上,您提供的所有css标记-在Safari 1.0+中均可使用,但显示标记除外(在Safari 1.3.2+中适用)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。