首字母与悬停 [英] first-letter versus hover

查看:69
本文介绍了首字母与悬停的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述



好​​的,今天的电子邮件带来了一位读者的评论,指出了

我早就注意到自己的东西但是没有做了什么

关于它。


在我的页面上,我的段落上有一个第一个字母的样式。


到目前为止,非常好:有些段落以链接开头,而

样式表中有样式用于链接,悬停等等。第一个

字母仍然显示为段落的第一个字母的样式。


在Mozilla中,如果有人在这些链接中悬停,则第一个字母

风格蒸发(并且布局也会自动调整以适应)。

我在WinIE中看不到这种效果,也没有在Opera中看到这种效果(我试过6.04)。


但是,我必须承认,根据我的经验,Mozilla

一般按照指定的方式行事,而WinIE则倾向于做一个

可能是有意的: - }


要说实话,我只介绍了第一个字母的风格,有点好玩,如果它变得很麻烦,它将成为第一个

的东西之一。我很乐意离开。但是现在主题已经提出了b / b
,是否有人关心评论(a)哪种行为是正确的并且

(b)如何修复第一个字母是什么样的反对被gazumped

悬停?


我把整个事情简化为一个简单的测试案例,其中包含

内联样式表,以帮助概述所涉及的内容。


转到 http://ppewww.ph.gla.ac.uk/~flavell/...st-letter.html

您应该看到链接的第一个字母是红色,并且比正常大
。 (链接的其余部分是传统的

蓝色。)


但是将鼠标悬停在链接上,在Mozilla中,以及第一个字母的样式

蒸发。


现在看一下样式表。仅仅

的存在触发了这种效果:


a:link:hover {}


(我发现我可以从

花括号中取出所有属性,但效果仍然存在。)


注意 - 如果你拿链接,那么它被视为已访问,而你

将无法再以此形式重现效果。但是,

如果一个然后添加到样式表:


a:visited:hover {}


那么对于访问过的链接也会重新显示效果。


OK, today''s email brought a comment from a reader, pointing out
something that I''d long since noticed myself but hadn''t done anything
about it.

On my pages, I''ve got a first-letter style on paragraphs.

So far, so good: some of the paragraphs begin with a link, and
there are styles in the stylesheet for link, hover etc. The first
letter is still displayed as styled for the paragraph''s first-letter.

In Mozilla, if one hovers over one of these links, the first-letter
style evaporates (and the layout also shuffles itself around to fit).
I don''t see this effect in WinIE, nor in Opera (I tried 6.04).

However, I have to admit it''s been my experience that Mozilla
generally does what one specifies, whereas WinIE tends to do what one
might have intended instead :-}

To be honest, I only introduced the first-letter style for a bit of
fun, and if it gets to be a nuisance it would be one of the first
things I''d be happy to do without. But now that the topic has been
raised, does anyone care to comment (a) which behaviour is correct and
(b) what to do to fix the first-letter style against being "gazumped"
by the hover?

I''ve boiled the whole thing down to a simple test case with an
in-lined stylesheet to assist in overviewing what''s involved.

Go to http://ppewww.ph.gla.ac.uk/~flavell/...st-letter.html and
you should see the first letter of the link is a red-ish colour and
larger than normal. (The rest of the link being the conventional
blue.)

But hover over the link, in Mozilla, and the first-letter style
evaporates.

Now look at the stylesheet. This effect is triggered by the mere
presence of:

a:link:hover { }

(I found that I could take away all of the properties from the
curly braces, but the effect persisted.)

N.B - if you take the link, then it counts as "visited", and you
won''t be able to reproduce the effect again in this form. However,
if one then adds to the stylesheet:

a:visited:hover { }

then the effect re-appears for visited link(s) too.

推荐答案

" Alan J. Flavell" < FL ***** @ ph.gla.ac.uk>在消息中写道

新闻:Pi ******************************* @ ppepc56.ph。 gla.ac.uk ...
"Alan J. Flavell" <fl*****@ph.gla.ac.uk> wrote in message
news:Pi*******************************@ppepc56.ph. gla.ac.uk...

好的,今天的电子邮件带来了读者的评论,指出了我早就注意到的一些事情。但是没有做任何关于它的事情。

在我的页面上,我的段落上有一个第一个字母的样式。

到目前为止,非常好:有些段落以链接开头,并且
样式表中有样式用于链接,悬停等。第一个
字母仍显示为段落的第一个字母的样式。

在Mozilla中,如果一个人在这些链接中徘徊,那么第一个字母的
风格就会消失(而且布局也会自动调整以适应)。
我不喜欢在WinIE中看不到这种效果,在Opera中也没有看到这种效果(我试过6.04)。

然而,我不得不承认Mozilla一般按照我的指示行事,这是我的经验。而WinIE倾向于做一个
可能有意的事情: - }

说实话,我只介绍了冷杉st字母风格有点儿好玩,如果它变得令人讨厌,那将是我很乐意做的第一件事。但是现在已经提出了这个话题,是否有人关心评论(a)哪种行为是正确的?
(b)如何修复第一个字母样式以防止gazumped<悬停?

我把整个事情简化为一个带有
内嵌样式表的简单测试用例,以帮助概述所涉及的内容。 br />
转到 http://ppewww.ph.gla.ac.uk/~flavell/...st-letter.html
你应该看到链接的第一个字母是红色和
比平时大。 (链接的其余部分是传统的蓝色。)

但是将鼠标悬停在链接上,在Mozilla中,第一个字母的样式会消失。

现在看一下样式表。这种效果仅仅由以下因素引发:

a:link:hover {}

(我发现我可以带走所有的属性
花括号,但效果仍然存在。)

注意 - 如果你接受链接,那么它算作已访问,你就不会成为能够以这种形式再次重现效果。但是,
如果然后添加到样式表:

a:visited:hover {}

那么效果也会重新出现在访问过的链接中。

OK, today''s email brought a comment from a reader, pointing out
something that I''d long since noticed myself but hadn''t done anything
about it.

On my pages, I''ve got a first-letter style on paragraphs.

So far, so good: some of the paragraphs begin with a link, and
there are styles in the stylesheet for link, hover etc. The first
letter is still displayed as styled for the paragraph''s first-letter.

In Mozilla, if one hovers over one of these links, the first-letter
style evaporates (and the layout also shuffles itself around to fit).
I don''t see this effect in WinIE, nor in Opera (I tried 6.04).

However, I have to admit it''s been my experience that Mozilla
generally does what one specifies, whereas WinIE tends to do what one
might have intended instead :-}

To be honest, I only introduced the first-letter style for a bit of
fun, and if it gets to be a nuisance it would be one of the first
things I''d be happy to do without. But now that the topic has been
raised, does anyone care to comment (a) which behaviour is correct and
(b) what to do to fix the first-letter style against being "gazumped"
by the hover?

I''ve boiled the whole thing down to a simple test case with an
in-lined stylesheet to assist in overviewing what''s involved.

Go to http://ppewww.ph.gla.ac.uk/~flavell/...st-letter.html and
you should see the first letter of the link is a red-ish colour and
larger than normal. (The rest of the link being the conventional
blue.)

But hover over the link, in Mozilla, and the first-letter style
evaporates.

Now look at the stylesheet. This effect is triggered by the mere
presence of:

a:link:hover { }

(I found that I could take away all of the properties from the
curly braces, but the effect persisted.)

N.B - if you take the link, then it counts as "visited", and you
won''t be able to reproduce the effect again in this form. However,
if one then adds to the stylesheet:

a:visited:hover { }

then the effect re-appears for visited link(s) too.




我会说这是一个Mozilla bug。


问候,

Peter Foti




I would say this is a Mozilla bug.

Regards,
Peter Foti



Alan J. Flavell写道:
Alan J. Flavell wrote:

在我的页面上,我有段落上的第一个字母样式。

到目前为止,这么好:一些段落以链接开头,并且样式表中有样式用于链接,悬停等等。
字母仍然显示为段落的第一个字母的样式。

在Mozilla中,如果一个人悬停在其中一个链接上,则第一个字母的
样式会消失(并且布局也会自动调整以适应)。

这种效果仅由以下因素引发:

a:link:hover {}

On my pages, I''ve got a first-letter style on paragraphs.

So far, so good: some of the paragraphs begin with a link, and
there are styles in the stylesheet for link, hover etc. The first
letter is still displayed as styled for the paragraph''s first-letter.

In Mozilla, if one hovers over one of these links, the first-letter
style evaporates (and the layout also shuffles itself around to fit).

This effect is triggered by the mere presence of:

a:link:hover { }




多个伪类可以工作吗?


p:f第一封信,p> a:悬停:第一个字母{}

-

Brian

按照我的地址中的说明发送电子邮件我



Would multiple pseudo classes work?

p:first-letter, p>a:hover:first-letter { }
--
Brian
follow the directions in my address to email me


" Brian" <我们***** @ julietremblay.com.invalid-除去-这部分>写在

消息新闻:YK ******************** @ rwcrnsc52.ops.asp.att。 net ...
"Brian" <us*****@julietremblay.com.invalid-remove-this-part> wrote in
message news:YK********************@rwcrnsc52.ops.asp.att. net...
Alan J. Flavell写道:
Alan J. Flavell wrote:

在我的页面上,我的段落上有一个第一个字母的样式。

到目前为止,这么好:有些段落以链接开头,并且
样式表中有样式用于链接,悬停等。第一个
字母仍然显示为样式段落的第一个字母。

在Mozilla中,如果一个人在这些链接中徘徊,那么第一个字母的
风格就会消失(并且布局也会自动调整以适应) 。

此效果仅由以下内容触发:

a:link:hover {}

On my pages, I''ve got a first-letter style on paragraphs.

So far, so good: some of the paragraphs begin with a link, and
there are styles in the stylesheet for link, hover etc. The first
letter is still displayed as styled for the paragraph''s first-letter.

In Mozilla, if one hovers over one of these links, the first-letter
style evaporates (and the layout also shuffles itself around to fit).

This effect is triggered by the mere presence of:

a:link:hover { }



多个伪类工作?

p:第一个字母,p> a:悬停:第一个字母{}



Would multiple pseudo classes work?

p:first-letter, p>a:hover:first-letter { }




也许......但是Mozilla会仍然被打破。 :)


奇怪的是,这适用于Mozilla:


p:第一个字母,p> a:第一个字母

{font-size:125%;颜色:#933; background-color:#fff6eb; }


然而,这导致IE不再起作用。事实上,如果除了p:first-letter之外还添加了任何其他

标识符,IE就会停止工作。


这两种浏览器都被破坏了。 :)


问候,

Peter Foti



Maybe... but Mozilla would still be broken. :)

Oddly enough, this works for Mozilla:

p:first-letter, p>a:first-letter
{ font-size: 125%; color: #933; background-color: #fff6eb; }

However, that causes IE to no longer work. In fact, if you put any other
identifiers in addition to p:first-letter, IE stops working.

Both of these browsers are broken. :)

Regards,
Peter Foti


这篇关于首字母与悬停的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆