繁体   English   中英

CSS样式不适用于容器div

[英]CSS style doesn't apply to container div

就容器div而言,CSS样式适用于所有元素(据我所知)。 我无法使它正常工作,我已经尝试了一切。 它应该有宽度和高度以及黑色背景颜色。 这是不适用的代码:

#container {
    width: 588px;
    height: 617px;
    background-color:#000;
    margin: auto;    
}

代码似乎是正确的。 CSS和HTML均已通过w3c验证器。

请帮助,我一无所知。 谢谢。

现在,查看页面的html,您已将容器标记设置为类。 您需要将其设置为div id,或将其更改为css中的类。

所以在上面的代码中,只需将#更改为a。 (期间)在集装箱前面

.container {   /* replaced # with a period */
    width: 588px;
    height: 617px;
    background-color:#000;
    margin: auto;    
}

你的容器是一个class而不是一个id

将 CSS 样式应用于<div></div><div id="text_translate"><p>我的问题是下面的 html</p><pre> &lt;div class="editor-container"&gt; &lt;div class="editor-row curFocus"&gt; &lt;div class="editor-label"&gt; &lt;label for="FirstName"&gt;First Name&lt;/label&gt; &lt;/div&gt; &lt;div class="editor-field"&gt; &lt;input class="text-box single-line valid" id="FirstName" name="FirstName" type="text" value="Nancy" maxlength="20"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt;</pre><p> 当用户选择输入字段时,我通过一些 javascript 将 class "curFocus" 添加到外部 div 以突出显示 label 和输入字段。</p><p> 我的 css 是 -</p><pre> .editor-container { border: thin solid #444444; display: table; width: 100%; }.editor-row { width: 100%; display: table-row; }.editor-label { padding-left: .4em; width: 40%; }.editor-label, .editor-field { padding-right: .4em; padding-bottom: .2em; padding-top: .2em; display: table-cell; }.curFocus { border: 2px solid #05365b; background-color: #d3e5f2; margin: 3px; padding: 3px; }</pre><p> 我的问题是,在 Chrome 12 和 IE9 中使用调试器时,它们都显示了应用于外部 div 的边框设置。 但是,在查看表单时,浏览器都不会显示指定的边框。 所有其他 css 设置工作正常。 我还尝试将“.curFocus”的定义更改为“.curFocus div”。 但这也将样式应用于每个嵌套的 div,但确实在所有 div 上显示了边框。</p><p> 虽然我不是 CSS 专家,但不清楚为什么这不起作用。</p><hr><p> 编辑这里是 jsfiddle 链接 - <a href="http://jsfiddle.net/photo_tom/KmsF5/1/" rel="nofollow">http://jsfiddle.net/photo_tom/KmsF5/1/</a> 。 在进行测试时,如果在 IE7 兼容模式下,它确实可以在 IE9 中正常工作。 否则,它不能正确显示。 很抱歉不包括链接,仍然习惯了 jsfiddle 甚至存在的事实。</p></div>

[英]Apply CSS style to <div>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 CSS样式不适用 将 CSS 样式应用于<div></div><div id="text_translate"><p>我的问题是下面的 html</p><pre> &lt;div class="editor-container"&gt; &lt;div class="editor-row curFocus"&gt; &lt;div class="editor-label"&gt; &lt;label for="FirstName"&gt;First Name&lt;/label&gt; &lt;/div&gt; &lt;div class="editor-field"&gt; &lt;input class="text-box single-line valid" id="FirstName" name="FirstName" type="text" value="Nancy" maxlength="20"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt;</pre><p> 当用户选择输入字段时,我通过一些 javascript 将 class "curFocus" 添加到外部 div 以突出显示 label 和输入字段。</p><p> 我的 css 是 -</p><pre> .editor-container { border: thin solid #444444; display: table; width: 100%; }.editor-row { width: 100%; display: table-row; }.editor-label { padding-left: .4em; width: 40%; }.editor-label, .editor-field { padding-right: .4em; padding-bottom: .2em; padding-top: .2em; display: table-cell; }.curFocus { border: 2px solid #05365b; background-color: #d3e5f2; margin: 3px; padding: 3px; }</pre><p> 我的问题是,在 Chrome 12 和 IE9 中使用调试器时,它们都显示了应用于外部 div 的边框设置。 但是,在查看表单时,浏览器都不会显示指定的边框。 所有其他 css 设置工作正常。 我还尝试将“.curFocus”的定义更改为“.curFocus div”。 但这也将样式应用于每个嵌套的 div,但确实在所有 div 上显示了边框。</p><p> 虽然我不是 CSS 专家,但不清楚为什么这不起作用。</p><hr><p> 编辑这里是 jsfiddle 链接 - <a href="http://jsfiddle.net/photo_tom/KmsF5/1/" rel="nofollow">http://jsfiddle.net/photo_tom/KmsF5/1/</a> 。 在进行测试时,如果在 IE7 兼容模式下,它确实可以在 IE9 中正常工作。 否则,它不能正确显示。 很抱歉不包括链接,仍然习惯了 jsfiddle 甚至存在的事实。</p></div> 为什么CSS不适用于div? CSS不适用于页脚div div没有以适当的CSS样式显示 将CSS样式套用至div 如果 div 不存在,你能在 CSS 中应用 CSS 规则吗? CSS-内部div不会停留在外部div容器内 通过innerHTML输入时,span不适用CSS样式 CSS-将鼠标悬停在元素上不会将样式应用于另一样式
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM