初学者的问题，看不懂css

peiming_ge 2008-07-08 09:44:55

ul li a {
display: block;
font-size: 12px;
border: 1px solid #ccc;
margin-top: 2px;
margin-left: 3px;
padding: 3px;
text-decoration: none;
color: #777;
}

ul li a:hover {
background-color: #339999;
}

li ul {
display: none;
top: 20px;
}

li:hover ul,li.over ul {
display: block;
}

哪位达人能帮忙解释一下"ul li a","ul li a:hover","li ul","li:hover ul,li.over ul"是什么意思？谢谢了！

...全文

86 7 打赏收藏转发到动态举报

写回复

用AI写文章

7 条回复

切换为时间正序

请发表友善的回复…

发表回复

peiming_ge 2008-07-08

打赏
举报

哈哈，我就是懒得看书，太多太多书要看。我是实用主义，需要了就学点需要的

peiming_ge 2008-07-08

打赏
举报

[Quote=引用 4 楼 gpm 的回复:]
PrewinZZZ
我还是有些一知半解，ul li a之间的空格是代表什么意思呢？能不能更详细点呢？
[/Quote]
我好像明白了，谢谢二位

sjmlsxp 2008-07-08

打赏
举报

无语看书吧

peiming_ge 2008-07-08

打赏
举报

PrewinZZZ
我还是有些一知半解，ul li a之间的空格是代表什么意思呢？能不能更详细点呢？

PrewinZZZ 2008-07-08

打赏
举报

哪位达人能帮忙解释一下"ul li a","ul li a:hover","li ul","li:hover ul,li.over ul"是什么意思？
依次是：<li><a href="#">设计</a> 你可以对照代码看它控制的部分
a:hover 鼠标滑过

peiming_ge 2008-07-08

打赏
举报

还是贴上完整的代码，楼上的朋友，能不能解释一下这些样式表名和下面的HTML中的元素关系？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>下拉多级菜单-css系列教程-超级宝贝-http://www.chaojibaby.com</title>



<style>

ul { padding:0; margin:0; list-style:none;}

li { float:left; width:100px;}

ul li a { display:block; font-size:12px; border:1px solid #ccc; margin-top:2px; margin-left:3px; padding:3px; text-decoration:none; color:#777;}

ul li a:hover { background-color:#339999;}

li ul { display:none; top:20px;}

li:hover ul,li.over ul { display:block;}

</style>



</head>

<body>



<ul id ="nav">

	<li><a href="#">设计</a>

		<ul>

			<li><a href="#">平面设计</a></li>

			<li><a href="#">网页设计</a></li>

			<li><a href="#">动画设计</a></li>

		</ul>

	</li>

	<li><a href="#">程序</a>

		<ul>

			<li><a href="#">asp程序</a></li>

			<li><a href="#">php程序</a></li>

			<li><a href="#">jsp程序</a></li>

		</ul>

	</li>

	<li><a href="#">维护</a>

		<ul>

			<li><a href="#">网站编辑</a></li>

			<li><a href="#">网站推广</a></li>

			<li><a href="#">网站优化</a></li>

		</ul>

	</li>

</ul>

</body>

</html>