这样的下拉菜单用HTML怎么写？
这种灰色的我知道应该是select被disable了才这样，但是如果不disable的话，怎么让他显示的时候是这样的？（我们作业是给了一张图然后只用HTML和css让网页...
这种灰色的我知道应该是select被disable了才这样，但是如果不disable的话，怎么让他显示的时候是这样的？
（我们作业是给了一张图然后只用HTML和css让网页看上去和图片一模一样）所以就想知道如果不用disable，怎么写才能让网页一打开就是这样的显示？
谢谢！！！！！ 展开
（我们作业是给了一张图然后只用HTML和css让网页看上去和图片一模一样）所以就想知道如果不用disable，怎么写才能让网页一打开就是这样的显示？
谢谢！！！！！ 展开
1个回答
展开全部
如果不用Javascript的话，实现是可以实现，就是浏览器兼容性方面会有问题，IE6和IE7下的效果很差。如下图，我用CSS3代码按照你给出的图片做的效果（Chrome浏览器）：
下图是IE8浏览器下的效果：
整体代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
.select_diy {
border:2px solid #c1c1c1;
border-bottom-color:#d0d0d0;
border-radius:5px;
padding:8px;
color:#999;
font-weight:bold;
font-size:18px;
width:300px;
box-shadow: 0 2px 2px rgba(255,255,255,.4), inset 1px 0 5px rgba(0,0,0,.2);
background:#eaeaea;
background-image:-webkit-linear-gradient(top,#e7e7e7,#fcfcfc);
background-image:-moz-linear-gradient(top,#e7e7e7,#fcfcfc);
background-image:-ms-linear-gradient(top,#e7e7e7,#fcfcfc);
background-image:linear-gradient(top,#e7e7e7,#fcfcfc);
}
</style>
</head>
<body style="background:#f5f5f5">
<div style="width:350px; margin:50px auto">
<select class="select_diy">
<option>United States (+1)</option>
</select>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
