【问题标题】:force webpage cursor强制网页光标
【发布时间】:2010-06-21 08:16:22
【问题描述】:

根据w3schools

游标属性指定类型 时要显示的光标 指向一个元素。

但是,我发现在使用使用 iframe 的富文本编辑器时,在某些浏览器下不显示元素光标。 Firefox/Chrome/Safari/Konqueror 可以工作,但 IE/Opera 不行。

在这种情况下,有没有办法在所有浏览器中可靠地设置光标?例如,一种独立于指向哪个元素来设置光标的方法。

编辑: 光标样式设置在 iframe 内的元素上。除了 IE/Opera 似乎无法在 iframe 中正确检测悬停事件之外,此方法有效。

【问题讨论】:

    标签: html css cross-browser cursor


    【解决方案1】:

    也许这样的东西会在你的样式表中起作用:

    * { cursor:pointer!important; }
    

    我还怀疑您可能必须在文本编辑器框架的样式中应用这样的规则。您应该阅读编辑器的文档以获取有关如何操作的说明。

    【讨论】:

    • 鉴于问题的性质/措辞,这可能是一个有效的答案......但通常我会指出,在大多数情况下使用!important 是一个坏主意,而应该使用 CSS特异性w3.org/TR/CSS2/cascade.html#specificity
    【解决方案2】:

    鉴于 WYSIWYG 编辑器使用 <iframe> 并且 <iframe> 是它自己的文档,您的 CSS 不会不适用于 <iframe> 的内容。

    当您使用 <iframe> 时,生成的 DOM 结构看起来有点像这样......

    <html>
        <head>
            <title>iframe example</title>
            <link type="text/css" rel="stylesheet" href="outer.css" />
        </head>
        <body>
            <div>
                The contents of the outer document!
                <iframe>
                    <html>
                        <head>
                            <title>iframe example</title>
                            <link type="text/css" rel="stylesheet" href="inner.css" />
                        </head>
                        <body>
                            <div>
                                The Contents of the iFrame!
                            </div>
                        </body>
                    </html>
                </iframe>
            </div>
        </body>
    </html>
    

    ...以及outer.css 中定义的规则不适用于&lt;iframe&gt; 的内容,inner.css 的内容不适用于外部文档。

    【讨论】:

    • 是的,我正在 iframe 中应用样式。这就是为什么我的解决方案适用于大多数浏览器...
    • 啊,好点;我错过了它在大多数浏览器中工作的部分。我的错! :)
    猜你喜欢
    • 2014-06-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多