Css 页眉div上未显示边框底部_Css

Css 页眉div上未显示边框底部

css

Css 页眉div上未显示边框底部,css,Css,我试图在标题div的底部添加1px边框，但它没有显示

我试图在标题

div

的底部添加1px边框，但它没有显示<有人能帮忙吗

是否与我在标题

div

中添加指定的

height

有关？
还是与利润率崩溃有关？还是两者都有

以下是我在CSS中的内容

@charset "UTF-8";

body {
    font: 100%/1.4;
    background-color:#FFF;
    margin: 0;
    padding: 0;
    color: #000;
}

/* ~~ Element/tag selectors ~~ */
ul, ol, dl { 
    padding: 0;
    margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
    margin-top: 0;   
    padding-right: 15px;
    padding-left: 15px; 
}

h1 {
    font-family: 'Abel', Arial, sans-serif;
    font-size:24px;

}

h2 {
    font-family: 'Abel', Arial, sans-serif;
    font-size:18px;
}

p {
    font-family: 'Cutive Mono', Georgia, serif;
    font-size:14px;

}

#home #homelink,
#aboutus #aboutuslink,
#ourwork #ourworklink,
#contactus #contactuslink {
    font-family: 'Abel', Arial, sans-serif;
    color: #494949;
    font-size:17px;
    text-decoration:none;
}

#mainNav {
    margin: 0;
    padding: 0;
    list-style: none;
}

#mainNav li {
    float: left;
    padding: 40px 20px 0 20px;
}

#mainNav li:first-child {
    border-left: 0px;
    padding-left: 0px;
}

#mainNav a {
    font-family: 'Abel', Arial, sans-serif;
    color: #666;
    font-size:17px;
    text-decoration:none;
    padding: 0 20px 0 20px;
}

#mainNav a:hover {
    color:#FFF;
    background-color: #494949;
}

a img { 
    border: none;
}

a:link {
    color: #42413C;
    text-decoration: underline; 
}
a:visited {
    color: #6E6C64;
    text-decoration: underline;
}
a:hover, a:active, a:focus { 
    text-decoration: none;
}

.container {
    width: 1352px;
    background-image:url(Images/sktchbook-bgd.jpg);
    background-repeat:no-repeat;
    margin: 0 auto; 
}

.header {
    width: 780px;
    height: 82px;
    margin-left:90px;
    margin-right: 90px;
    border-bottom: 1px #494949;
}

.sidebar-logo {
    float: left;
    width: 70px;
}

.subcontainer {
    width: 980px;
    min-height: 880px;
    margin: 0 auto;
}


.content {

    padding: 10px 0;
    margin-left:90px;
    margin-right:90px;
}


.fltrt {  
    float: right;
    margin-left: 8px;
}
.fltlft { 
    float: left;
    margin-right: 8px;
}
.clearfloat { 
    clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

还有HTML

<body>

<div class="container">
<div class="subcontainer">
<div class="header">

<div id="mainNav">
  <ul id="mainNav">
  <li class="firstitem"><a href="#" id="home" target="_self">Home</a></li>
  <li><a href="#" id="aboutus" target="_self">About Us</a></li>
  <li><a href="#" id="ourwork" target="_self">Our Work </a></li>
  <li><a href="#" id="flashlink" target="_self">Contact Us </a></li>
  </ul>
</div>  

</div>
      <div class="sidebar-logo"><img src="Images/k-blondel-design-logo.png" width="64" height="108" alt="K Blondel Design logo" />
    </div>
  <div class="content">
    <h1>Instructions    </h1>
    <p>At K Blondel Design we aim to fill the gap between the over exuberant furniture maker and the general carpenter. Trained in the art of creating affordable and elegant solutions to 3D problems.</p>
    <p>As a small business we are able to deliver a personal one to one design service, talking through various design and material possibilities and arriving at an affordable, bespoke and stylish solution.</p>
    <p>From design through to construction and installation we specialise in storage solutions, furniture and interiors for both the domestic and commercial markets. </p>
    <p>We have 20 years' design and commercial experience and an ever-growing client list spanning Sussex, Hampshire, London and Kent.</p>

    <!-- end .content --></div>
    <!-- end .subcontainer --></div>
  <!-- end .container --></div>
</body>
</html>








说明书
在K Blondel Design，我们的目标是填补过度繁荣的家具制造商和普通木匠之间的差距。在为3D问题创建价格合理且优雅的解决方案方面接受过培训
作为一家小型企业，我们能够提供个人一对一的设计服务，讨论各种设计和材料的可能性，并达成一个价格合理、定制和时尚的解决方案
从设计到施工和安装，我们专注于国内和商业市场的存储解决方案、家具和内饰
我们拥有20年的设计和商业经验，客户名单不断扩大，覆盖苏塞克斯、汉普郡、伦敦和肯特郡

您应该提到边框样式，例如实心：

.header {
    width: 780px;
    height: 82px;
    margin-left:90px;
    margin-right: 90px;
    border-bottom: 1px solid #494949;
}

试试这种风格

border-bottom: 1px solid #494949;

或

设置边框样式，如边框底部：1px实心；。标题{边框底部：1px实心#494949；}只是为了更清楚。

border-bottom: 1px dotted #494949;