简单实用的选择框样式

最新推荐文章于 2024-06-21 11:31:12 发布

dgdisme

最新推荐文章于 2024-06-21 11:31:12 发布

阅读量1.8k

点赞数

分类专栏： html & css

本文链接：https://blog.csdn.net/ycwol/article/details/40984399

版权

html & css 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

<!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>
    <title>港区</title>
<style type="text/css">
*{ margin:0; padding:0;}
body{ font-size:13px; font-family:"微软雅黑"; color:#333; background:#dde0e5;}
.sub_radio{ width:350px; height:200px; margin:100px auto 0 auto; border:1px solid #ddd; border-radius:8px; box-shadow:3px 3px 3px #ccc; padding:20px; background:#fff;}
.tit{ height:30px; line-height:30px; border-bottom:1px solid #dfdfdf; font-size:16px; color:#348df0;}
.radio{ margin:20px 0;}
.mr_r{ margin-right:8px;}
.search span{ float:left; width:50px; display:block; height:30px; line-height:30px;}
#containerNo{ width:200px; height:28px; line-height:28px; border:1px solid #dfdfdf; padding:0 5px; float:left;}
#containerNoSubmit{ width:60px; height:30px; border:none; color:#dfdfdf; text-align:center; background:#348df0; cursor: pointer; float:left; margin:0 0 0 6px; border-radius:5px;}
.clear{ clear:both;}
</style>
<script language="javascript" type="text/javascript">
	var querycontainerno=function(){
		var radios = document.getElementsByName('theRadio');
		var containerno=document.getElementById('containerNo');
		***
	}
    </script>
    </head>
    <body>
<div class ="sub_radio ">
    <div class="tit">选择港区:</div>
    <div class="radio">
          <input type="radio" value="SCT" name="theRadio" id="Radio1" checked="checked"><label for="Radio1" class="mr_r">蛇口SCT</label>
          <input type="radio" value="CCT" name="theRadio" id="Radio2"><label for="Radio2" class="mr_r">赤湾</label>
          <input type="radio" value="MW" name="theRadio" id="Radio3"><label for="Radio3" class="mr_r">妈湾</label>
          <input type="radio" value="SKP" name="theRadio" id="Radio4"><label for="Radio4" class="mr_r">招港</label>
          <input type="radio" value="YICT" name="theRadio" id="Radio5"><label for="Radio5" class="mr_r">盐田港</label>
    </div>
    <div class="search">
    <span>柜 号 :</span>
    <input type="text" name="containerNo" maxlength="11" value="" id="containerNo" οnkeydοwn= "if(window.event.keyCode==13) querycontainerno()">
    <input id="containerNoSubmit" type="button" title="查询柜号" value="查询" οnclick="querycontainerno()">
    <div class="clear"></div>
    </div>

</div>
    </body>
</html>

感谢@夏天的味道

欢迎交流 http://blog.csdn.net/ycwol/article/details/40984399

dgdisme

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
简单实用的选择框样式

设备交接单打印*{ margin:0; padding:0;}body{ font-size:13px; font-family:"微软雅黑"; color:#333; background:#dde0e5;}.sub_radio{ width:350px; height:200px; margin:100px auto 0 auto; border:1px solid #ddd; bor
复制链接

扫一扫

专栏目录