我不是一个Web开发人员,但可以阅读一个CSS文件并实施它。我有一些CSS,下面的工作是正确的,除了.topbox,只要我尝试在div中使用它,它只是显示为普通文本而不是CSS样式,我试着重新加载浏览器缓存,我甚至试图复制和粘贴一些工作和改变名称的CSS,但即使这不起作用。所以这让我相信我的CSS中有一个错误导致了这个问题。CSS不工作,因为它应该
.redbox {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
margin: 10px;
padding: 10px;
overflow: hidden;
border: 2px solid rgba(170,75,75,0.7);
-webkit-border-radius: 10px;
border-radius: 10px;
font: normal 14px/1 Verdana, Geneva, sans-serif;
color: rgba(61,60,60,0.85);
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
background: rgba(168,10,10,0.45);
-webkit-box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.3) ;
box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.3) ;
text-shadow: 1px 1px 1px rgba(0,0,0,0.2) ;
}
.topbox {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
float: right;
padding: 5px;
border: 2px solid rgba(152,0,0,0.7);
-webkit-border-radius: 1px;
border-radius: 1px;
font: normal 14px/1 Verdana, Geneva, sans-serif;
color: black;
text-align: center;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
background: rgba(224,102,102,0.7);
}
试图像这样实现它;
<div class="topbox">
Test<i class="fa fa-trash"></i>
</div>
这不起作用,它只是显示为普通文本。然而..
<div class="redbox">
Test<i class="fa fa-trash"></i>
</div>
显示出来就好..任何想法?
编辑:试图使这更清楚是怎么回事..
这是使用类=“红盒子”从上面的代码中会发生什么..
然而,当我复制并粘贴完全相同的.redbox CSS来.topbox和我期望相同的结果..这是我所得到的..
这里是更新的CSS
.redbox {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
margin: 10px;
padding: 10px;
overflow: hidden;
border: 2px solid rgba(170,75,75,0.7);
-webkit-border-radius: 10px;
border-radius: 10px;
font: normal 14px/1 Verdana, Geneva, sans-serif;
color: rgba(61,60,60,0.85);
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
background: rgba(168,10,10,0.45);
-webkit-box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.3) ;
box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.3) ;
text-shadow: 1px 1px 1px rgba(0,0,0,0.2) ;
}
.topbox {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
margin: 10px;
padding: 10px;
overflow: hidden;
border: 2px solid rgba(165,161,74,0.65);
-webkit-border-radius: 10px;
border-radius: 10px;
font: normal 14px/1 Verdana, Geneva, sans-serif;
color: rgba(61,60,60,0.85);
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
background: rgba(153,148,7,0.35);
-webkit-box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.3) ;
box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.3) ;
text-shadow: 1px 1px 1px rgba(0,0,0,0.2) ;
}
但.redbox显示为预期,.topbox只是显示没有和CSS格式..
你的意思是“显示为普通文本而不是CSS样式”?你能用[mcve]显示问题来使用Stack Snippets吗?请包括你期望发生的事情,然后会发生什么。 –
我编辑了我的上述问题以更好地展示发生了什么。使用该片段将是困难的,因为这是大型烧瓶项目的一部分。 –
看来这是一个问题,CSS没有得到更新重新加载。我清除缓存,并在铬中的一切,它仍然无法正常工作。我不得不下载一个扩展来重新加载CSS。不知道发生了什么事情。这让我疯狂! –