CSS如何使对齐的下边框?

uukirby uukirby 墨衍会员 · AI 创作全网分发 墨衍智能分发 通过墨衍一键同步至各平台 可同步平台 CSDN微信公众号微博知乎掘金百家号博客园抖音小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年,写一次发全网 我也要 + 加入社区

<!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=utf-8" />
<title>UL与LI对齐</title>
<style type="text/css">
ul.menu
{
font-size:18px;
list-style-type:none;
margin:0;
margin-left:20px;
padding:0;
float:left;
}

ul.menu li
{
float:left;
width:100px;
line-height:24px;
border:#CCC 2px solid;
border-bottom-color:#FFF;
}

ul.menu li.selected
{
font-weight:bold;
float:left;
width:120px;
line-height:30px;
border:#CCC 2px solid;
border-bottom-color:#FFF;
}

ul.menu li:hover
{
background-color:#0CF;
}
</style>
</head>

<body>
<ul class="menu">
<li class="selected">NO.1</li>
<li>NO.2</li>
<li>NO.3</li>
</ul>
</body>
</html>


显示出来的情况:

想让所有的<li>标签对齐<ul>边框的下边框
怎么做?

在此先表示感谢……
...全文

相关推荐

评论 6
收藏 已收藏
分享
返回顶部
uukirby
CSS 61,116 成员 60,701 内容