如果要用 border-radius設(shè)置圓角改怎么做啊。。
<!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>導(dǎo)航菜單</title>
<style type="text/css">
*{margin:0; padding:0; font-size:14px;}
ul{ list-style:none;}
a{color:#333;text-decoration:none}
.nav li{ float:left;}
.nav li a{ display:block; text-indent:20px; height:30px; line-height:30px; width:100px; background-color:#efefef; margin-bottom:1px;}
.nav li a.on, .nav li a:hover{ border-radius:10px 10px 0px 0px; background-color:#F60;color:#fff;}
</style>
</head>
<body>
<ul class="nav">
? ? <li><a href="#">首 頁</a></li>
? ? <li><a href="#">新聞快訊</a></li>
? ? <li><a href="#">產(chǎn)品展示</a></li>
? ? <li><a href="#">售后服務(wù)</a></li>
? ? <li><a href="#">聯(lián)系我們</a></li>
? </ul>
</body>
</html>
我試了一下沒有反應(yīng)，是為什么，，，，，，
2018-11-29
這樣應(yīng)該可以吧，我試了一下。
.nav li a{ display:block; text-indent:20px; height:30px; line-height:30px; width:100px; background-color:#efefef; margin-bottom:1px;?border-radius:10px 10px 0px 0px;?}
2016-12-07
border-radius需要考慮瀏覽器的兼容性，你可以使用chrome瀏覽器。
我用你的代碼在chrome上可以顯示效果。
希望可以采納。^-^
2016-10-18
? ? ? ? border-top-left-radius: 10px;
? ? ? ? border-top-right-radius: 10px;
分別將左上、右上設(shè)置弧度
2016-10-12
你這代碼是對的
2016-10-12
試驗(yàn)了一下你的代碼，在hover的時(shí)候是有圓角效果的啊？您說的反應(yīng)是不是沒有在首頁的<a>中定義class="on"？