powered by simpleCommunicator - 2.0.48     © 2025 Programmizd 02
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Строки меню в таблице
10 сообщений из 10, страница 1 из 1
Строки меню в таблице
    #40111220
катастрофа
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
здравствуйте, опции поля выбора
<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
Строки меню в таблице
    #40111231
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
катастрофа , конкретно в option "заровнять" буквы можно только указав не пропорциональный шрифт.

Или начать писать свой самописный select...
...
Рейтинг: 0 / 0
Строки меню в таблице
    #40111239
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
катастрофа,

http://htmlbook.ru/html/pre
...
Рейтинг: 0 / 0
Строки меню в таблице
    #40111268
катастрофа
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
вадя,
Код: 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
Строки меню в таблице
    #40111275
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
катастрофа , в описании pre четко написано
авторЭлемент <pre> определяет блок предварительно форматированного текста .
Про select и option там нет ничего.
...
Рейтинг: 0 / 0
Строки меню в таблице
    #40111299
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
катастрофа,

увы ничего не получится
если только не написать свой веб-компонент
...
Рейтинг: 0 / 0
Строки меню в таблице
    #40111385
катастрофа
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
вадя,
как сей портрет доделать до конца?
Код: 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
Строки меню в таблице
    #40111392
Фотография 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" />
<!--
<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
Строки меню в таблице
    #40111518
катастрофа
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
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
Строки меню в таблице
    #40111529
катастрофа
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
спасибо справился
...
Рейтинг: 0 / 0
10 сообщений из 10, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Строки меню в таблице
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]