HTML下拉列多列 [英] HTML dropdown multi columns
问题描述
现在我有2个下拉列表值。
例如：
< select name =healthyid =healthy>
< optgroup =fruit>< / optgroup>
< option value =apple> apple< / option>
< option value =pineapple> pineapple< / option>
< optgroup =vegetables>< / optgroup>
< option value =carrots>胡萝卜< / option>
< option value =tomato>番茄< / option>
< / select>
现在，而不是在1列中显示这些组，我想要将它们显示在不同的列中。这是可能的，没有改变代码呢？
修改
在得到相同的答案两次后，这是不可能的，我会改变这个问题一点。
是否可以使自己的表单元素？例如在Actionscript中，VB.Net，asp.Net可以让你自己的元素。我知道您可以使用CSS更改布局，但这不是解决方案。
所以我试图说，我只想根据一个选择为HTML创建自己的元素。
我想我找到了一个答案。
我的html代码：
<！DOCTYPE html PUBLIC - // W3C // DTD XHTML 1.0 Transitional / / ENhttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
< html xmlns =http://www.w3.org/1999/xhtml>
< head>
< meta http-equiv =Content-Typecontent =text / html; charset = utf-8/>
< title> Untitled Document< / title>
< link href =select.css =stylesheettype =text / css/>
< / head>
< body>
< select name =selid =sel>
< optgroup label =group1>
< option value =1> 1< / option>
< option value =2> 2< / option>
< option value =3> 3< / option>
< option value =4> 4< / option>
< / optgroup>
< optgroup label =group2>
< option value =5> 5< / option>
< option value =6> 6< / option>
< option value =7> 7< / option>
< option value =8> 8< / option>
< / optgroup>
< / select>
< / body>
< / html>
我的css代码
@charsetutf-8;
/ * CSS文件* /
#sel {
background-color：＃FF0;
width：40px;
}
#sel optgroup {
background-color：#CFF;
显示：inline-table;
width：20px;
}
- 编辑 -
问题：IE而chrome不能识别内联表。所以它不会在这些浏览器上工作。
I have a question about a select in HTML. Now I have 2 dropdowns with values. for example:
<select name="healthy" id="healthy">
<optgroup="fruit"></optgroup>
<option value="apple">apple</option>
<option value="pineapple">pineapple</option>
<optgroup="vegetables"></optgroup>
<option value="carrots">carrots</option>
<option value="tomato">Tomato</option>
</select>
Now instead of showing these groups in 1 column, I would want to show them in different columns. Is that possible, without changing the code to much?
Edit After getting the same answer twice, that it's not possible, I will change this question a little. Is it possible to make your own form element? For example in Actionscript, VB.Net, asp.Net it's possible to make your own elements. I know you can change the layout with CSS, but that's not the solution. So what I try to say, I just want to make my own element for HTML, based on a select.
I think I found an answer. my html code:
<!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>Untitled Document</title>
<link href="select.css" rel="stylesheet" type="text/css" />
</head>
<body>
<select name="sel" id="sel">
<optgroup label="group1">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</optgroup>
<optgroup label="group2">
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
</optgroup>
</select>
</body>
</html>
And my css code
@charset "utf-8";
/* CSS Document */
#sel{
background-color:#FF0;
width:40px;
}
#sel optgroup{
background-color:#CFF;
display:inline-table;
width:20px;
}
-- edit -- problem: IE and chrome doesn't recognize inline-table. so it won't work on those browsers.
这篇关于HTML下拉列多列的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
