代码之家 › 专栏 › 技术社区 › Michael Mao

CSS优先顺序?我的讲稿幻灯片对不对?

precedence css html

6

Michael Mao · 技术社区 · 14 年前

我注意到已经有几个类似的问题和答案,但让我先澄清一下我的具体问题:

我有演讲幻灯片,上面写着:

http://mindinscription.net/webapp/csstest/precedence.PNG

here

为了自己测试,我在自己的服务器上做了一个测试页 here

导入的样式表?我做错了吗?我看不到使用FireBug的效果
它说嵌入的样式表比链接的/导入的样式表有更高的优先级,但是,如果我把链接的/导入的标签放在后面,它就不起作用了。

下面是源代码:

<html>
<head>
    <style type="text/css">
        #target
        {
            border : 2px solid green;
            color  : green;
        }
    </style>
    <link rel="stylesheet" href="./linked.css" type="text/css" media="screen" />
</head>
<body>
    <div id="target">A targeted div tag on page.</div>

    <img src="cat.jpg" alt="" style="width : 102px; height : 110px;" width="204px" height="220px" />
</body>
</html>

有经验的CSS人员能帮我弄清楚幻灯片是否正确吗?

坦率地说,我自己也很困惑,因为在幻灯片中我可以清楚地看到其他一些“不正确”的语句,比如JavaScript在客户端(服务器端JavaScript呢?)和“嵌入样式在网页的头部” “(怎么回事?我不允许把它放在身体标签里?)

2 回复 | 直到 12 年前

1

2

Marcel Korpel 14 年前

首先,对于导入的样式表,它们是指使用 the @import rule .

第二,在css2.1规范的解释下面的几行,有一个 cascading order the spec 可能对你的考试也有用。祝你好运。

更新: 有点 googling 导致:

2

Babiker 14 年前

属性由 <style></style> 正在由中的选择器重新分配 linked.css
没有具有的元素 id="div" imported.css .