HTML5中的div赢得'；无法从css3文件中显示_Html_Css

HTML5中的div赢得'；无法从css3文件中显示

html css

HTML5中的div赢得'；无法从css3文件中显示,html,css,Html,Css,我正在使用HTML5和外部css3样式表创建一个网页我已经创建了一个div来显示一个圆角框。当css div代码在html文档中时，它显示良好。但一旦我将其转移到css3样式表中，该框就会消失。我已经找了几个小时的答案了，但我想不出哪里出了问题这是我的html代码 <style type="text/css"> div { border:8px solid #000000; padding:10px 10px; background:#ffffff;

我正在使用HTML5和外部css3样式表创建一个网页

我已经创建了一个div来显示一个圆角框。当css div代码在html文档中时，它显示良好。但一旦我将其转移到css3样式表中，该框就会消失。我已经找了几个小时的答案了，但我想不出哪里出了问题

这是我的html代码

<style type="text/css"> 
div
{
    border:8px solid #000000;
    padding:10px 10px; 
    background:#ffffff;
    width:500px;
    margin: auto;
    border-radius:25px;
    -moz-border-radius:25px; /* Firefox 3.6 and earlier */
}
</style>

</head>
<body>

<div><h1>WELCOME TO THE WEBSITE</h1></div>

转到我的css文件，并删除从html文件

div框消失了。css文件中定义的所有其他元素都正确显示，因此我知道该文件已链接。我只是不知道为什么这个分区不显示

谢谢你的回复。完整的css代码是

body
{
background-image:url(roses.png);
background-repeat:repeat top;
background-colour:#ffffff;
background-attachment:scroll;
}

h1
{
text-shadow: 2px 2px 2px #efefef;
}

div
{
border:8px solid #000000;
padding:10px 10px; 
background:#ffffff;
width:500px;
margin: auto;
border-radius:25px;
-moz-border-radius:25px; /* Firefox 3.6 and earlier */
}

#para1
{
text-align:center;
color:red;
}

考虑到您在问题中所说的一切，我觉得浏览器似乎正在缓存样式表的旧版本

签入Firebug以查看它认为样式表中的内容

尝试将样式表的URL直接加载到它自己的浏览器窗口中，必要时刷新它，并检查新代码是否已就位

我唯一能想到的另一种可能性是，样式表代码的末尾出现了某种错误，这会阻止浏览器在它之后解析样式

这是可能的，但是如果没有看到整个CSS代码，我无法验证它。

如果没有看到完整的代码，我不能确定，但是我要在CSS中更改的一件事是与圆角边框相关的两行的顺序

在任何特定于供应商的指令之后，应始终具有

边界半径指令。换句话说，-moz border radius:25px
行需要排在第一位
为什么这在一个场景中有效，而在另一个场景中无效我不完全确定，但有一些奇怪的地方…你在哪个浏览器中预览？
我给了div单独的名称，现在css文件中的一切似乎都正常工作。快乐时光：）请发布您的样式表。问题很可能就在那里。你有没有试过去掉样式表中的其他样式，以消除它们作为问题的可能原因？是的，我试过了。我不得不保存样式表，但无法取回用undo删除的内容，因此不得不重新编写整个内容。我也试着给div一个id和一个class，但这并没有改变任何事情。我应该加上我在本地查看网页。它还没有上传到服务器上。我在css中所做的每一次更改都会立即反映在网页上。您好，谢谢您的回复。我正在使用Firefox7查看页面。还有人能告诉我我是如何给每个div赋予自己的身份的吗？我尝试了.divname和div.divname，但两者似乎都不起作用。我已经找到了如何命名div的方法，但我仍然需要让它们从css文件中工作：（那么你有没有尝试过根据我的帖子编辑你的css？并在Firebug（或类似）中查看页面）确保加载了正确的CSS？
body
{
background-image:url(roses.png);
background-repeat:repeat top;
background-colour:#ffffff;
background-attachment:scroll;
}

h1
{
text-shadow: 2px 2px 2px #efefef;
}

div
{
border:8px solid #000000;
padding:10px 10px; 
background:#ffffff;
width:500px;
margin: auto;
border-radius:25px;
-moz-border-radius:25px; /* Firefox 3.6 and earlier */
}

#para1
{
text-align:center;
color:red;
}