Div和CSS的border-top的问题,应该不难,求大家帮忙。

我的网页字下沉,怎么让他不下沉
两幅图都使用border-top来实现,分析图一的CSS半天没分析出来怎么实现的
已解决,之前被li迷惑住了,没有注意到a中间有类,其实只要设置a:hover的border-top就行了,谢谢大家耐心地解答,由于只能采纳一个最佳答案,所以不能三个人都采纳,但都赞同了。

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
ul,li{ margin:0; padding:0;}
li{list-style:none;}
body{ background:#666666;}
#ul{width:400px; height:50px; margin:10px auto; background:#000; font:14px/46px Arial, Helvetica, sans-serif;}
#ul li{width:100px; height:50px; float:left; text-align:center;}
#ul a{ text-decoration:none; color:#fff; display:block;border-top:4px solid transparent;}
#ul a:hover{ border-color:#fff;}
</style>
</head>
<body>
<ul id="ul">
    <li><a href="#">首页</a></li>
    <li><a href="#">链接</a></li>
    <li><a href="#">关于</a></li>
    <li><a href="#">微博</a></li>
</ul>
</body>
</html>

将链接(A元素标签)的上边框提前设置为不可见边框,鼠标经过的时候让这个边框显示出来即可。

温馨提示:内容为网友见解,仅供参考
第1个回答  2013-07-27
<html>
<head>
<style>
#nav {
width:900px;
height:200px;
background:#999;
}
#nav ul {
width:100%;
height:100%;
margin:70px 0 0 0;
padding:0;
}
#nav ul li{
text-align:center;
list-style:none;
width:80px;
height:20px;
float:left;
margin:0 0 0 10px;
border-top:4px solid;
}
#nav ul li:hover {
cursor:pointer;
text-decoration:underline;
background-color:#999;
color:blue;
}
</style>

</head>
<body>
<div id="nav">
<ul>
<li style="border-top:4px solid transparent;">111111</li>
<li>222222</li>
<li>333333</li>
</ul>
</div>
</body>
</html>

 将border-top统一定义一个相同的高度,如:border-top:4px solid; 不需要的设置为透明就行

第2个回答  2013-07-28
上一张图片的理念就是,之前就有border , 只是颜色和背景相同,鼠标滑过之后改变颜色!

第二张图片,的问题就 使用margin-top:- XX ,XX为边框高度

在HTML+CSS中如何实现上一个div覆盖下一个div的border-top部分?
方法很多 1可以给div的外边距设置负值,来覆盖 2可以用绝对定位 3border-top的颜色可以设置要覆盖的div的颜色 形成视觉上的假覆盖

在HTML+CSS中如何实现上一个div覆盖下一个div的border-top部分?
你这个意思不就是div1在最上层么 那么div1 z-index:999 依次递减 再设置每个div margin-top:-1px; \/\/大小看你border-top而定 很简单

div+css的边框怎样设置?为什么只显示上边框?
在css中某标签上使用border:1px solid black即可显示,要使用方向则加left、right等,如border-top即上边框 只显示上边框说明你的高度(height)或者长度(width)设置出现问题了,好好检查一下吧

css定位属性中对top right bottom left属性的描述有个小问题搞不懂...
首先你需要先弄明白一个事情,就是如果你应用了定位的话那margin、padding等属性都是不起作用的,但是border有用,偏移像素为零你指的是top:0这样吗?如果是这样的话那也要看你相对哪个定位的,也不一定是靠在一起的。

div+css如何设置边框border?
下面就一个简单的盒子为例:如图 border这个位置可选border:四边边框,border-top:顶部边框,类似还有border-left\/right\/button。宽度即为边框宽度。样式有如图:颜色忽略,如有不清楚的可以参见w3school教程http:\/\/www.w3school.com.cn\/css\/css_border.asp 望采纳 ...

html 如何用div+css设置背景的半个角
首先,用背景图片最简单;如果你非要是用div+css,我给你一个思路。利用border的特性,border-left和border-bottom的颜色设置成白色,border-top和border-right设置成蓝色,这样视觉上得到你想要的效果。你可以参考梦想天空的这篇文章:http:\/\/www.cnblogs.com\/lhb25\/archive\/2013\/02\/19\/css-triangle....

DIV+CSS层的边框问题,有的显示有的不显示。
.se{margin-top:2px;border:2px dotted:#336666;} 代码错误 更正:.se{margin-top:2px;border:2px dotted #336666;} 把dotted 和 #336666之间的 : 删掉 做技术一定要细心。

css中一个div包含一个小div,如果外层的div不设border属性,里边的div上部...
这个问题发生的原因是根据规范,一个盒子如果没有上补白(padding-top)和上边框(border-top),那么这个盒子的上边距会和其内部文档流中的第一个子元素的上边距重叠。再说了白点就是:父元素的第一个子元素的上边距margin-top如果碰不到有效的border或者padding.就会不断一层一层的找自己 “领导”(父...

css中div边框问题
是吞吃现象,两个相邻的margin会发生吞吃现象,我这里不作太多介绍了,解决方案:使用zoom:1。这个zoom好象是专门为解决ie6 bug而生的。或者在不影响布局的情况下把margin属性换成padding属性,又或者在相邻两者之间用边框或者其他标签隔开

我用DIV+CSS排版。。怎么样去除HR上下的空白哇。。
用如下css样式就可以解决了 hr{height:1px;border:none;border-top:1px solid Black;margin:0;*margin:0 0 -14px 0;float:none;*float:left;display:block;}

相似回答