div边框未显示 [英] Div borders not showing
问题描述
由于人员代码的多种变化,我正在努力找到直接解决我问题的方法.
I'm struggling to find a direct answer to my problem due to the many variations in peoples code.
我想我的代码可能非常混乱,因为我正试图为我的合作伙伴建立一个网站,而且很快(我只有几个小时的Dreamweaver经验,仅此而已)!
I imagine my code is probably very messy as i'm trying to build a website for my partner, and quickly (i have just a few hours Dreamweaver experience and that's it)!
无论如何,我有一个固定宽度的网站,其中一列中有大约6个单独的div,所有这些div都包含在一个网页大小的div中,作为我的背景色.
Anyway, i have a fixed width website where there are around 6 separate divs in a column, all contained within a webpage-sized div for my background colour.
无论如何,当我尝试向页脚添加边框时,它不会显示在浏览器中.我只想要1px来将'main'div与页脚分开,它就不会出现.这对于我的导航div也一样.
Anyway, when i am trying to add a border to my footer, it does not display in browsers. I just wan 1px to separate the 'main' div from the footer and it won't appear. This is also the same for my navigation div.
body{
color:#00000;
margin-left:0px;
margin-right:0px;
margin-top:0px;
margin-bottom:0px;
}
#body{
background-color:#000000;
}
#header{
width:800px; /* The width is fixed by pixels */
height:150px; /* The height is fixed by pixels*/
color:#fff;
margin-left:auto;
margin-right:auto;
margin-top:0px;
margin-bottom:0px;
}
#navigation {
width:798px;
height:51px;
margin-left:auto;
margin-right:auto;
margin-top:0px;
margin-bottom:0px;
border-style:solid; /*Selecting solid made the border appear*/
border-left:1px;
border-right:1px;
border-top:0px;
border-bottom:1px;
border-color:#000000;
text-align:center;
background-color:ffffff;
}
#main {
width:798px; /* The width is fixed by pixels */
height:800px; /* The height is fixed by pixels*/
color:#fff;
background-color:#fff;
margin-left:auto;
margin-right:auto;
margin-top:0px;
margin-bottom:0px;
border-style:solid; /*Selecting solid made the border appear*/
border-left:1px;
border-right:1px;
border-top:0px;
border-bottom:0px;
border-color:#000000;
text-align:center;
}
#footer {
/*Styling for any element with the id="container" */
width:798px; /* The width is fixed by pixels */
height:100px; /* The height is fixed by pixels*/
color:#fff;
background-color:#fff;
margin-left: auto;
margin-right:auto;
border-style:solid;
border-left:1px;
border-right:1px;
border-bottom:1px;
border-top:1px;
border-color:#000000;
}
#Facebook {
float:right;
}
#Twitter {
float:right;
}
#LinkedIn {
float:right;
}
</style>
</head>
<body>
<div id="body">
<div id="header">
<a href="Home.html"><img src="Images/Logo.jpg" alt="Ruth Fifer Jewellery"> </a>
</div>
<div id="main">
<div id="navigation">
<br />
</div>
<br />
<br />
<img src="Images/Home Image.jpg" />
</div>
<div id="footer">
<a href="https://www.facebook.com/ruth.fifer.5?fref=ts" target="_blank"> <img src="Images/facebook.png" alt="Facebook" id="Facebook"/></a>
<a href="https://twitter.com/martynjakins" target="_blank"> <img src="Images/twitter.png" alt="Twitter" id="Twitter"/></a>
<a href="http://www.linkedin.com/profile/view?id=225071408&trk=tab_pro" target="_blank"><img src="Images/linkedin.png" alt="LinkedIn" id="LinkedIn"/></a></div>
</div>
</body>
如果有人能够提供帮助,那就太好了,因为我觉得由于我的经验不足,我可能正在使用有冲突的代码,但现在没有时间学习所有内容,而会回到某个地方我有更多时间去调整东西.
If anyone is able to help it would be great, as i get the feeling I'm probably using conflicting codes due to my inexperience but don't have time to learn everything right now and will instead go back at a point where i have more time to adjust things.
谢谢
Martyn
推荐答案
1)在代码的开头写入<!DOCTYPE><html><head>
标记.
1) Write <!DOCTYPE><html><head>
tag in the beginning of the code.
2)在代码末尾写入</html>
标记.
2) Write </html>
tag in the end of the code.
和使用:
边框:1px 0px实心#000000;
border: 1px 0px solid #000000;
它将解决您的问题.看看 http://jsfiddle.net/p2269/1/我按照我的解释编写了代码,显示边框.
And it will solve your problem. Look at http://jsfiddle.net/p2269/1/ I wrote code as I explained and it shows borders.
这篇关于div边框未显示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!