Question

我已经学习了大约2个月的HTML和CSS，但显然我还是新手。我试图在这里创建一个标题导航栏，但是当我设置属性display:inline时，噗！他们消失了。我很确定这个问题很简陋，但你有任何帮助。

div { 
    border-radius: 5px 55px 5px 55px;
}

#Header {
    height: 50px; 
    width: 200px; 
    background-color: #f38630; 
    margin-bottom: 10px; 
    margin-top: 10px; 
    display: inline;
}

.Left {
    height: 300px; 
    width: 150px; 
    background-color: #A7DBD8; 
    float: left; 
    margin-bottom: 10px;
}

.Right {
    height: 300px; 
    width: 450px; 
    background-color: #E0E4CC;
    float: right; 
    margin-bottom: 10px;
}

#Footer {
    height: 50px;
    background-color: #69D2E7;
    clear: both;
}

Answer 1

简而言之，您不应该将display: inline用于任何不打算在文本块中显示的内容。

这是学习布局基础知识的好网站：http://learnlayout.com

如果你真的想学习这些东西，这是我所知道的最好的地方：https://dash.generalassemb.ly：）

希望有所帮助。如果您觉得我没有回答您的问题，请告诉我。

Answer 2

我不会对div使用display：inline -block，而是将其应用于列表项或标签。

Answer 3

它与包含块的生成有关，无论您的元素是内联还是块，也是定位的类型。没有内容的内联元素将不会显示。以下是您的问题的事实上的资源： de facto web standards

visual rendering

显示：内联删除块

3 个答案: