Страница 1 из 2
CSS JS PHP XYZ
Добавлено: 13 ноя 2020, 13:25
mikei
Заголовок, чтобы по каждому члучаю темы не плодить.
Как только CSSом выбрать вот такой элемент <label>?
Код: Выделить всё
<div class="wrap">
<div class="wrap-input>
<input>
</div>
<label>
</div>
Если бы не было HTML <div class="wrap-input></div> то я бы делал так
Но с завернутым инпутом так не знаю как. Если никак, то я эту завертку убрал джаваскриптом, но кривовато, потому что она малтипл. Если CSS никак, то следующий вопрос будет JS
Re: CSS JS PHP XYZ
Добавлено: 13 ноя 2020, 13:41
LeoV
Re: CSS JS PHP XYZ
Добавлено: 13 ноя 2020, 13:56
mikei
Спасибо, очень близко. Но так я пробовал. > не совсем то (с) pin
Какая-то более хитрая комбинация должна быть. Попробую ещё, доложу
Re: CSS JS PHP XYZ
Добавлено: 13 ноя 2020, 14:38
mikei
Нет. Посмотрел внимательно, там простой случай.
Уточняю. Мне надо выбрать и инпут и лэйбл при условии, когда input:checked
Могу показать это живьём, чтобы инспектором посмотреть.
Re: CSS JS PHP XYZ
Добавлено: 13 ноя 2020, 17:53
levak
Re: CSS JS PHP XYZ
Добавлено: 13 ноя 2020, 21:55
ura
mikei писал(а): ↑13 ноя 2020, 13:25
Заголовок, чтобы по каждому члучаю темы не плодить.
Как только CSSом выбрать вот такой элемент <label>?
Код: Выделить всё
<html>
<head>
<style>
.wrap { font-size: 20px; }
.wrap-input { font-size: 40px; }
.wrap label { font-size: 60px; font-weight: bold; }
</style>
</head>
<body>
<div class="wrap">
HELLO
<div class="wrap-input">
<input type="text" value="world"/>
</div>
<label>OF PAIN</label>
</div>
<label>The end</label>
</body>
</html>
Seems working
Re: CSS JS PHP XYZ
Добавлено: 13 ноя 2020, 22:14
mikei
ura писал(а): ↑13 ноя 2020, 21:55
mikei писал(а): ↑13 ноя 2020, 13:25
Заголовок, чтобы по каждому члучаю темы не плодить.
Как только CSSом выбрать вот такой элемент <label>?
Код: Выделить всё
<html>
<head>
<style>
.wrap { font-size: 20px; }
.wrap-input { font-size: 40px; }
.wrap label { font-size: 60px; font-weight: bold; }
</style>
</head>
<body>
<div class="wrap">
HELLO
<div class="wrap-input">
<input type="text" value="world"/>
</div>
<label>OF PAIN</label>
</div>
<label>The end</label>
</body>
</html>
Seems working
Не. ТЗ может быть не понятно сформулировано, но не всё так просто. Сделаю вижуалс
без джаваскрипта скорее никак.
Re: CSS JS PHP XYZ
Добавлено: 14 ноя 2020, 07:36
ura
Поправь мой пример и покажи что не работает, я скажу как исправить.
Re: CSS JS PHP XYZ
Добавлено: 14 ноя 2020, 11:49
mikei
ura писал(а): ↑14 ноя 2020, 07:36
Поправь мой пример и покажи что не работает, я скажу как исправить.
Вот же, я уточнил
mikei писал(а): ↑13 ноя 2020, 14:38
Уточняю. Мне надо выбрать и инпут и лэйбл при условии, когда input:checked
Target label when input:checked. Покажу через пару часов. Там ещё сложнее, это я ещё упростил для себя html, насколько был доступ к нему. В оригинальном html input завернут в label.
Re: CSS JS PHP XYZ
Добавлено: 14 ноя 2020, 13:22
mikei
ura писал(а): ↑14 ноя 2020, 07:36
Поправь мой пример и покажи что не работает, я скажу как исправить.
Ura
https://presstype.net/ura/
Mikei
https://presstype.net/mikei/
Нижний ряд на чек меняет лэйблу цвет. Но JS. Как без? Здесь JS только для того, чтобы убрать мешающий див.
В идеале бы так сделать оргинальному HTMLу - первый ряд.
Re: CSS JS PHP XYZ
Добавлено: 14 ноя 2020, 15:46
ura
Then the +label option suggested before is correct.
Код: Выделить всё
<html>
<head>
<style>
.wrap { font-size: 20px; }
.wrap-input { font-size: 40px; }
.wrap-input input+label
{
font-weight: bold; color: blue;
}
.wrap-input input:checked+label
{
font-weight: bold; color: gray;
}
</style>
</head>
<body>
<div class="wrap">
HELLO WORLD
<div class="wrap-input">
<input type="checkbox" id="cb1"/>
<label for="cb1">OF CSS PAIN</label>
<input type="checkbox"/ id="cb2">
<label for="cb2">OR CSS PLEASURE</label>
</div>
<label>The choice is yours.</label>
</div>
</body>
</html>
Re: CSS JS PHP XYZ
Добавлено: 14 ноя 2020, 16:43
mikei
ura писал(а): ↑14 ноя 2020, 15:46
Then the +label option suggested before is correct.
Код: Выделить всё
<html>
<head>
<style>
.wrap { font-size: 20px; }
.wrap-input { font-size: 40px; }
.wrap-input input+label
{
font-weight: bold; color: blue;
}
.wrap-input input:checked+label
{
font-weight: bold; color: gray;
}
</style>
</head>
<body>
<div class="wrap">
HELLO WORLD
<div class="wrap-input">
<input type="checkbox" id="cb1"/>
<label for="cb1">OF CSS PAIN</label>
<input type="checkbox"/ id="cb2">
<label for="cb2">OR CSS PLEASURE</label>
</div>
<label>The choice is yours.</label>
</div>
</body>
</html>
Добавил туда же вариант собственно вопроса. Когда <div>input</div>label то эта схема перестает работать. Как div пропустить css-ом только? Мне очень нежелательно избавляться от него в htmle.
Казалось бы просто, а что-то не догоняю или невозможно.
Re: CSS JS PHP XYZ
Добавлено: 14 ноя 2020, 21:39
ura
Тогда через javascript. Или надо понять зачем таки нужен div.
Re: CSS JS PHP XYZ
Добавлено: 14 ноя 2020, 22:06
mikei
ura писал(а): ↑14 ноя 2020, 21:39
Тогда через javascript. Или надо понять зачем таки нужен div.
это очень крутой плагин FormidablePro там много для чего может быть наставлено. Например, можно чекбоксики на картиночки заменить. А мне надо на кнопачки заменить. Значит никак
А я думал я самый крутой сиэсэшник каморки
Ну тогда по тупому джаваскриптом. Тогда просто класс туда зааппендить на чек и даже с эчтиэмелом не надо мухлевать.
Re: CSS JS PHP XYZ
Добавлено: 15 ноя 2020, 08:10
ura
Если плагин трансформирует div, тогда надо смотреть может он добавляет какие классы или позволяет инджектить дополнительный контент внутрь. Тогда по логике лейба может быть добавлена по определенному событию определенному в плагине. Опять така трудно сказать какой путь выбрать не зная полной картины.
