HTML раскрывающиеся мультиколонки - PullRequest
Новая
       20

HTML раскрывающиеся мультиколонки

0 голосов
/ 09 января 2012

У меня есть вопрос по поводу выбора в HTML. Теперь у меня есть 2 выпадающих со значениями. например: 

<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>

Теперь вместо того, чтобы показывать эти группы в 1 столбце, я бы хотел показать их в разных столбцах. Это возможно, не меняя код на много?

Редактировать Получив один и тот же ответ дважды, что это невозможно, я немного изменю этот вопрос. Можно ли сделать собственный элемент формы? Например, в Actionscript, VB.Net, asp.Net можно создавать свои собственные элементы. Я знаю, что вы можете изменить макет с помощью CSS, но это не решение. Итак, что я пытаюсь сказать, я просто хочу создать свой собственный элемент для HTML на основе выбора.

Ответы [ 2 ]

2 голосов
/ 10 января 2012

Я думаю, что нашел ответ. мой HTML-код: 

<!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>

И мой код CSS 

@charset "utf-8";
/* CSS Document */

#sel{
    background-color:#FF0;
    width:40px;
    }
#sel optgroup{
    background-color:#CFF;
    display:inline-table;
    width:20px;

    }

- редактировать - Проблема: IE и Chrome не распознают встроенную таблицу. поэтому он не будет работать в этих браузерах.

0 голосов
/ 09 января 2012

это не возможно, насколько я знаю. Но вы можете сделать 2 поля выбора рядом друг с другом!

...