写一段代码,包括html和css,在css文件:common.css,我写
.r {
float:right;
}
在 html 文件中,写入:
<div class="menu r">
</div>
但是这个div还是在左边,代码如下: 通用.css
/*header start*/
.headerbg {
width:100%;
height:100px;
background-color: #fdfdfd;
}
.header {
width:1200px;
}
.logo {
display:block;
}
.f {
float:left;
}
.menu {
width:570px;
height:50px;
background-color: skyblue;
}
.r {
float:right;
}
/*header end*/
在html文件中,代码:
<div class="headerbg">
<div class="header">
<a href="#" class="logo f">
<img src="images/logo.gif" width="305" height="70" alt="...">
</a>
<div class="menu r">
</div>
</div>
</div>
但是div class = "menu r"还在左边,在chrome中,按F12,找到:
.r {
}
no content:float:right,你能告诉我为什么以及如何更正吗
最佳答案
console.log('float:right' === 'float:right')===>result : false
your code--------^ ^----------my code
console.log('float:right' === 'float:right');
console.log('float:right'.charCodeAt(5));-->//65306
console.log('float:right'.charCodeAt(5));--->//58
所以,问题出在 :
(冒号)中。
你可以从其他代码复制 float:right
吗?要修复它,请将其删除并复制并粘贴此代码:
.r { float: right; }
.headerbg {
width:100%;
height:100px;
background-color: #fdfdfd;
}
.header {
width:1200px;
background-color: red;
}
.logo {
display:block;
}
.f {
float:left;
}
.menu {
width:870px;
height:50px;
background-color: skyblue;
float:right;
}
.r {
float: right;
}
<div class="headerbg">
<div class="header">
<a href="#" class="logo f">
<img src="images/logo.gif" width="305" height="70" alt="...">
</a>
<div class="menu r">ss</div>
</div>
</div>
关于html - float 设置无效,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52124585/