Строки меню в таблице / HTML, JavaScript, VBScript, CSS

ReSQL.ru

Мобильная версия Контакт Правила FAQ Помощь

Гость

Войти | Регистрация | Профиль | Очистить

Новые сообщения | Избранное

Форумы | Пользователи | Статистика | Мод. лог | Поиск

Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр

Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Строки меню в таблице

10 сообщений из 10, страница 1 из 1

Строки меню в таблице

#40111220

катастрофа

Участник

Сообщения: 2 519

Рейтинг: 0 / 0

здравствуйте, опции поля выбора
<option>01. White #FFFFFF 255, 255, 255</option>
<option>02. Black #000000 0, 0, 0</option>
<option>03. IndianRed #CD5C5C 205, 92, 92</option>
<option>04. Blue #0000FF 0, 0, 255</option>
<option>05. Silver #C0C0C0 192, 192, 192</option>
<option>06. Red #FF0000 255, 0, 0</option>
<option>07. Yellow #FFFF00 255, 255, 0</option>
<option>08. Fuchsia #FF00FF 255, 0, 255</option>
<option>09. Green #008000 0, 128, 0</option>
<option>10. Aqua #00FFFF 0, 255, 255</option>
<option>11. GreenYellow #ADFF2F 173, 255, 47</option>
<option>12. MediumSpringGreen #00FA9A 0, 250, 154</option>
как можно поместить их в поле в таблице бесцветной, чтобы выровнять?
пользоваться &ensp пробелом - это ж не современно, муторно, результат не 100% будет
спасибо

...

Рейтинг:

0 / 0

12.11.2021, 10:10

| Ответить | Цитировать | Написать

Строки меню в таблице

#40111231

krvsa

Участник

Откуда: г Волжский

Сообщения: 13 823

Рейтинг: 1 / 0

катастрофа , конкретно в option "заровнять" буквы можно только указав не пропорциональный шрифт.

Или начать писать свой самописный select...

...

Рейтинг:

0 / 0

12.11.2021, 10:44

| Ответить | Цитировать | Написать

Строки меню в таблице

#40111239

вадя

Участник

Откуда: Екатеринбург

Сообщения: 19 399

Рейтинг: 0 / 0

катастрофа,

http://htmlbook.ru/html/pre

...

Рейтинг:

0 / 0

12.11.2021, 11:05

| Ответить | Цитировать | Написать

Строки меню в таблице

#40111268

катастрофа

Участник

Сообщения: 2 519

Рейтинг: 0 / 0

вадя,

Код: html

1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.

<!DOCTYPE html>
<html>
 
<body>
    <select id="select1"><pre>
	<option>01. White              #FFFFFF  255,  255,  255</option>
        <option>02. Black              #000000  0,    0,    0</option>
        <option>03. IndianRed          #CD5C5C  205,  92,   92</option>
        <option>04. Blue               #0000FF  0,    0,    255</option>
        <option>05. Silver             #C0C0C0  192,  192,  192</option>
        <option>06. Red                #FF0000  255,  0,    0</option>
        <option>07. Yellow             #FFFF00  255,  255,  0</option>
        <option>08. Fuchsia            #FF00FF  255,  0,    255</option>
        <option>09. Green              #008000  0,    128,  0</option>
        <option>10. Aqua               #00FFFF  0,    255,  255</option>
        <option>11. GreenYellow        #ADFF2F  173,  255,  47</option>
        <option>12. MediumSpringGreen  #00FA9A  0,    250,  154</option></pre>
    </select>
    <script>[...select1.querySelectorAll("option")].forEach(e => e.style.color = /#(?:[0-9a-fA-F]{3}){1,2}/g.exec(e.innerHTML))</script>
</body>
 
</html>

не взлетело, или я не так понял?

...

Рейтинг:

0 / 0

12.11.2021, 12:28

| Ответить | Цитировать | Написать

Строки меню в таблице

#40111275

krvsa

Участник

Откуда: г Волжский

Сообщения: 13 823

Рейтинг: 1 / 0

катастрофа , в описании pre четко написано
авторЭлемент <pre> определяет блок предварительно форматированного текста .
Про select и option там нет ничего.

...

Рейтинг:

0 / 0

12.11.2021, 12:51

| Ответить | Цитировать | Написать

Строки меню в таблице

#40111299

вадя

Участник

Откуда: Екатеринбург

Сообщения: 19 399

Рейтинг: 0 / 0

катастрофа,

увы ничего не получится
если только не написать свой веб-компонент

...

Рейтинг:

0 / 0

12.11.2021, 13:34

| Ответить | Цитировать | Написать

Строки меню в таблице

#40111385

катастрофа

Участник

Сообщения: 2 519

Рейтинг: 0 / 0

вадя,
как сей портрет доделать до конца?

Код: html

1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.

<!DOCTYPE html>
<html>
 
<body>
    <div id="select1">
        <pre>01. White              #FFFFFF   255,   255,   255</pre>
        <pre>02. Black              #000000   0,     0,     0</pre>
        <pre>03. IndianRed          #CD5C5C   205,   92,    92</pre>
        <pre>04. Blue               #0000FF   0,     0,     255</pre>
        <pre>05. Silver             #C0C0C0   192,   192,   192</pre>
        <pre>06. Red                #FF0000   255,   0,     0</pre>
        <pre>07. Yellow             #FFFF00   255,   255,   0</pre>
        <pre>08. Fuchsia            #FF00FF   255,   0,     255</pre>
        <pre>09. Green              #008000   0,     128,   0</pre>
        <pre>10. Aqua               #00FFFF   0,     255,   255</pre>
        <pre>11. GreenYellow        #ADFF2F   173,   255,   47</pre>
        <pre>12. MediumSpringGreen  #00FA9A   0,     250,   154</pre>
    </div>
    <script>[...select1.querySelectorAll("option")].forEach(e => e.style.color = /#(?:[0-9a-fA-F]{3}){1,2}/g.exec(e.innerHTML))</script>
</body>
</html>

...

Рейтинг:

0 / 0

12.11.2021, 15:21

| Ответить | Цитировать | Написать

Строки меню в таблице

#40111392

krvsa

Участник

Откуда: г Волжский

Сообщения: 13 823

Рейтинг: 1 / 0

катастрофа

как сей портрет доделать до конца?

Как набросок...

Код: html

1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<!--
<script src="https://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
-->
<style>
.select > table {
	display: none;
	border: 1px solid;
}
.select tr:hover {
	background-color: silver;
	cursor: pointer;
}
.select.open > table {
	display: table;
}
</style>
<script>
document.addEventListener('DOMContentLoaded', _ => {
	document.querySelectorAll('.select').forEach(slct => {
		slct.querySelector('button').addEventListener('click', el => {
			slct.classList.toggle('open')
		})
		slct.querySelector('table').addEventListener('click', el => {
			if (el.target.tagName !== 'TD') return
			const tr = el.target.parentNode
			slct.querySelector('input').value = tr.cells[1].innerHTML
			slct.classList.remove('open')
		})
	})
})
</script>
</head>
<body>
<div class="select">
	<div>
		<input />
		<button>_</button>
	</div>
	<table>
		<tr><td>01.<td>White<td>#FFFFFF<td>255<td>255<td>255</tr>
		<tr><td>02.<td>Black<td>#000000<td>0<td>0<td>0</tr>
		<tr><td>03.<td>IndianRed<td>#CD5C5C<td>205<td>92<td>92</tr>
		<tr><td>04.<td>Blue<td>#0000FF<td>0<td>0<td>255</tr>
		<tr><td>05.<td>Silver<td>#C0C0C0<td>192<td>192<td>192</tr>
	</table>
</div>
</body>
</html>

...

Рейтинг:

0 / 0

12.11.2021, 15:50

| Ответить | Цитировать | Написать

Строки меню в таблице

#40111518

катастрофа

Участник

Сообщения: 2 519

Рейтинг: 0 / 0

krvsa,
спасибо большое, а можно в коде

Код: html

1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
.clr_select > table {
	display: none;
	border: 1px solid;
}
.clr_select tr:hover {
	background-color: silver;
	cursor: pointer;
}
.clr_select.open > table {
	display: table;
}
</style>
<script>
document.addEventListener('DOMContentLoaded', _ => {
	document.querySelectorAll('.clr_select').forEach(slct => {
		slct.querySelector('button').addEventListener('click', el => {
			slct.classList.toggle('open')
		})
		slct.querySelector('table').addEventListener('click', el => {
			if (el.target.tagName !== 'TD') return
			const tr = el.target.parentNode
			slct.querySelector('input').value = tr.cells[1].innerHTML
			slct.classList.remove('open')
		})
	})
})
</script>
</head>
<body>
<div class="clr_select">
<div><input/><button>+</button></div>
<table>
<tr><td>01.<td>White            &ensp;&ensp;&ensp;<td>#FFFFFF<td>&ensp;255,   <td>&ensp;255,   <td>&ensp;255</tr>
<tr><td>02.<td>Black            &ensp;&ensp;&ensp;<td>#000000<td>&ensp;0,     <td>&ensp;0,     <td>&ensp;0</tr>
<tr><td>03.<td>IndianRed        &ensp;&ensp;&ensp;<td>#CD5C5C<td>&ensp;205,   <td>&ensp;92,    <td>&ensp;92</tr>
<tr><td>04.<td>Blue             &ensp;&ensp;&ensp;<td>#0000FF<td>&ensp;0,     <td>&ensp;0,     <td>&ensp;255</tr>
<tr><td>05.<td>Silver           &ensp;&ensp;&ensp;<td>#C0C0C0<td>&ensp;192,   <td>&ensp;192,   <td>&ensp;192</tr>
<tr><td>06.<td>Red              &ensp;&ensp;&ensp;<td>#FF0000<td>&ensp;255,   <td>&ensp;0,     <td>&ensp;0</tr>
<tr><td>07.<td>Yellow           &ensp;&ensp;&ensp;<td>#FFFF00<td>&ensp;255,   <td>&ensp;255,   <td>&ensp;0</tr>
<tr><td>08.<td>Fuchsia          &ensp;&ensp;&ensp;<td>#FF00FF<td>&ensp;255,   <td>&ensp;0,     <td>&ensp;255</tr>
<tr><td>09.<td>Green            &ensp;&ensp;&ensp;<td>#008000<td>&ensp;0,     <td>&ensp;128,   <td>&ensp;0</tr>
<tr><td>10.<td>Aqua             &ensp;&ensp;&ensp;<td>#00FFFF<td>&ensp;0,     <td>&ensp;255,   <td>&ensp;255</tr>
<tr><td>11.<td>GreenYellow      &ensp;&ensp;&ensp;<td>#ADFF2F<td>&ensp;173,   <td>&ensp;255,   <td>&ensp;47</tr>
<tr><td>12.<td>MediumSpringGreen&ensp;&ensp;&ensp;<td>#00FA9A<td>&ensp;0,     <td>&ensp;250,   <td>&ensp;154</tr>
</div>
</body>
</html>

чтобы три после названия цвета были указанного цвета?
спасибо

...

Рейтинг:

0 / 0

12.11.2021, 19:54

| Ответить | Цитировать | Написать

Строки меню в таблице

#40111529

катастрофа

Участник

Сообщения: 2 519

Рейтинг: 0 / 0

спасибо справился

...

Рейтинг:

0 / 0

12.11.2021, 20:34

| Ответить | Цитировать | Написать

10 сообщений из 10, страница 1 из 1

Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Строки меню в таблице

Цитировать

Написать

Автор*:

Ввести пароль для входа

Тема*:

Сообщение

Данное сообщение тематическое

Сообщение содержит картинки или видео 18+

Автор:

ВНИМАНИЕ! На данном подфоруме действуют строгие правила. Удостоверьтесь, что ваше сообщение соответствует им!

Форум или тема закрыты для гостей. Необходима авторизация!

Загрузить последнюю сохраненную версию

Вложение:

Вставить как галерею

Максимальный размер вложений: 4,0 МБ, аудио/видео: 8,0 МБ. Картинки большего размера ужимаются, если возможно.

Введите код, изображенный на картинке. Если код нечитаемый, кликните картинку, чтобы загрузить другой вариант.

Отправляя сообщение, я выражаю свое согласие с правилами форума и принимаю пользовательское соглашение.

Читали тему (0):

Читали форум (0):

Пользователи онлайн (0):

start [/forum/topic.php?fid=22&fpage=2&tid=1443167]:	0ms
get settings:	12ms
get forum list:	15ms
check forum access:	3ms
check topic access:	3ms
track hit:	138ms
get topic data:	14ms
get forum data:	3ms
get page messages:	52ms
get tp. blocked users:	2ms
others:	241ms

total:	483ms