css - 在声明 html 5 DTD 时,一些 css 样式不计算任何浏览器

标签 css html

“#help”的顶部和右侧样式在任何浏览器中都不会在将 doctype 声明为 HTML代码是:

    <div id="events">
        <img src="media/Event icon.png" alt="events" id="events_img">
    </div>
    <div id="colors" >
         <img src="media/CULTURAL.png" alt="Colours" id="Colors_img">
    </div>
    <div id="hospitality">
      <img src="media/117016-matte-blue-and-white-square-icon-business-notepad.png" alt="hospitality" id="hospitality_img">
    </div>
    <div id="help">
        <img id="help_img" src="media/Help.png" alt="help">
    </div>
    <img src="media/cadbell.fw.png" alt="cadbell" id="cadbell">
    <img src="media/cadbell2.fw.png" alt="cadbell" id="cadbell2">
    <img src="media/Bird-blue-icon.png" alt="angry bird" id="angry_bird">   

   <div id='bottom-div'></div>


       <img src="media/stick.fw.png" alt="stick" id="stick"> 
       <span id="dev"><b>Developed by:&nbsp </b><a href='#'>D Akhil Reddy</a></span>
    </div>
</div>

我只为 #help 及其子元素 #help_img 提供了 css 样式,top 和 right 不起作用, #help 的 css 样式:

#help{
position: absolute;
right: 320;
top: 390;
cursor: pointer;
width: 137px;
}
#help_img{
position:absolute;
left:10px;
}

最佳答案

Quirks Mode , CSS 声明如 right: 320被解释为 px单位是隐含的。这违反了 CSS 规范,该规范要求忽略此类声明。

如果你输入 <!doctype html>或任何其他触发标准模式的文档类型字符串,如果 CSS 代码有错误,事情可能会发生很大变化。

解决方案是修复 CSS 代码。在这种情况下,替换 320 就足够了和 390通过 320px390px .使用 W3C CSS Validator检查您的 CSS 代码。

关于css - 在声明 html 5 DTD 时,一些 css 样式不计算任何浏览器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16683706/

相关文章:

javascript - 将固定的 PX 侧边栏与基于百分比的内容混合

javascript - 插入可点击的图像

css - SCSS 加载程序弃用警告

css - firefox 如何决定使用哪些@-moz-document 规则?

html - 如何在 CSS 中实现对图像的 .selected

html - CSS 元素对齐

javascript - 如何显示来自对话框的 ajax 调用的消息?

css - 如何使用所有应用的 CSS 打印网页?

javascript - 我可以用其他方法(例如 CSS)来做到这一点吗?

html - 使用 Markdown 调整jupyter笔记本中的图像大小