?瑞思拜/
05589896html单选下拉列表，htmlcss实现简单下拉菜单
来源：互联网 浏览：74次 时间：2023-04-08
下拉栏简单案例，直接上效果 ?html源码 <!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" rel="external nofollow" href="css/index.css"></head><body> <div class="content"> <form class="form1w"> <select> <option>部门链接</option> <option>部门链接2</option> <option>部门链接3</option> <option>部门链接4</option> </select> </form> <form class="form1w"> <select> <option>请选择栏目</option> <option>教学科学1</option> <option>教学科学2</option> </select> </form> </div></body></html> ?css源码 * { padding: 0; margin: 0;}/*div*/.content{ width: 100%; height: 200px; background: #225f88;}form select{ width: 162px; /*宽*/ height: 40px; /*高*/ background-color: #a3b5bb; /*元素背景颜色*/ border: 1px solid #f1e8e8; /*边框线*/ color: #ffffff; /*字体颜色*/ outline:none; /*去掉黑框*/ margin: 30px 10px 0 50px; /*外边距*/ font-size: 16px; /*字体大小*/ }form option{ width: 160px; height: 40px; }
