#
Перейти из форума на сайт.

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в on-line?
Вход Забыли пароль? Первый раз на этом сайте? Регистрация
Компьютерный форум Ru.Board » Интернет » Web-программирование » Вопросы по CSS

Модерирует : Cheery

 Версия для печати • ПодписатьсяДобавить в закладки
Страницы: 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 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94

Открыть новую тему     Написать ответ в эту тему

Xrobak

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Ссылки для самостоятельного изучения:
 
Теория + примеры + учебники:
W3School: CSS Tutorial
MDN: Cascading Style Sheets (CSS)
WebReference: Уроки по HTML и CSS
htmlbook: Справочник CSS
YouTube: Основы CSS/CSS3
CSS для JavaScript-разработчика
Основы CSS - каскадные таблицы стилей
Статьи по основам CSS
 
Применение на практике:
StackOverflow: 'CSS' Questions
CSS-Tricks
 

Первый пост темы (до включения шапки).. ··· Текущий бэкап шапки..

Всего записей: 926 | Зарегистр. 16-08-2004 | Отправлено: 18:46 27-10-2004 | Исправлено: TheBarmaley, 05:24 27-02-2019
Mavrikii

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
kodex77

Цитата:
но там "Подробнее" это картинка, а не текст на картинке

ранее вы написано "подробнее" как текст. и на скриншоте я вижу, что оно идет как текст, потому что картинке text-shadow побоку, не генерит она тень от этого.
может лучше ссылку дадите чтобы посмотреть?

Всего записей: 8910 | Зарегистр. 20-09-2014 | Отправлено: 19:59 03-03-2020
kodex77



Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii, да ранее неправильно написал, там текст только "Жанр". А "Подробнее" это картинка.  
 
Вот весь код:  

Код:
<div style="text-shadow: 2px 2px 2px #cccccc;"><span>Жанр: <img style="position: relative; min-height: 100%; top: +3px;" src="foto.png" /></span></div>

 
Вот как получается с text-shadow и без text-shadow.
 
   
 

Всего записей: 126 | Зарегистр. 07-04-2012 | Отправлено: 20:07 03-03-2020
Mavrikii

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
kodex77

Цитата:
Вот как получается с text-shadow и без text-shadow

не верю, еще раз говорю.. у вас даже явно видно, что помимо text-shadow один из "жанр" жирным текстом, то есть не все показываете.
 
text-shadow не оказывает никакого влияния на картинку, а значит у вас есть еще что то, о чем умалчиваете. так, как выглядит у вас, будет если "подробнее" идет текстом. возможно он вставляется через ::after или ::before в css стиле. ссылку.

Всего записей: 8910 | Зарегистр. 20-09-2014 | Отправлено: 20:14 03-03-2020 | Исправлено: Mavrikii, 20:21 03-03-2020
kodex77



Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii, отправил ссылку в ЛС.

Всего записей: 126 | Зарегистр. 07-04-2012 | Отправлено: 20:24 03-03-2020
Mavrikii

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
kodex77

Цитата:
отправил ссылку в ЛС.


Цитата:
.f-info div > span:first-child {
    opacity: 0.7;
    display: inline-block;
    width: 150px;
    margin-left: -160px;
    font-weight: 700;
}

я же говорил, что дело не в тени

Всего записей: 8910 | Зарегистр. 20-09-2014 | Отправлено: 20:26 03-03-2020 | Исправлено: Mavrikii, 20:27 03-03-2020
kodex77



Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
я же говорил, что дело не в тени

 
Спасибо большое, это в общем CSS файле было, убрал все стало как нужно.

Всего записей: 126 | Зарегистр. 07-04-2012 | Отправлено: 20:48 03-03-2020
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Просьба подсказать по цвету и оттенку. Как можно сделать без JS, чтобы при выборе одного цвета RGB, например, основной цвет, автоматически подстраивался цвет границы (делался чуть темнее) и тени (светлее)?
 
В том же SVG можно сделать так: fill="rgba(255, 255, 255, 1.00)" fill-opacity="0.5". Возможно ли что-то подобное в CSS?

Всего записей: 2661 | Зарегистр. 30-06-2002 | Отправлено: 13:53 16-03-2020
Weinaum



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS
прямо в css нет, а вот используя препроцессоры sass или less - да.  
Примеров куча, ищите по словам что то вроде  using lighten() and darken() in sass / less

Всего записей: 1974 | Зарегистр. 18-06-2006 | Отправлено: 15:51 16-03-2020
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Weinaum
Спасибо за совет, ранее просматривал подобные примеры.
 
Можно ли как-то совместить darken() и rgba(), чтобы цвет был темнее и немного прозрачнее?

Всего записей: 2661 | Зарегистр. 30-06-2002 | Отправлено: 18:01 16-03-2020 | Исправлено: WONDROUS, 04:16 17-03-2020
Weinaum



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS
ну наверно, если я правильно понял, что вы хотите.
https://codepen.io/lagudal/pen/eYNroVw

Всего записей: 1974 | Зарегистр. 18-06-2006 | Отправлено: 09:59 17-03-2020
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Weinaum
Спасибо за ответ и пример!

Всего записей: 2661 | Зарегистр. 30-06-2002 | Отправлено: 14:03 17-03-2020
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Ещё просьба подсказать, если есть такой код CSS:

Код:
#%id% button {
код
}
 
.%id%butticon {
    color: $iconcolor;
}
#%id% button:hover .%id%butticon {
    color: darken($iconcolor, 5%);
}

то как правильно его оформить, переделать, в SCSS?

Всего записей: 2661 | Зарегистр. 30-06-2002 | Отправлено: 12:57 18-03-2020 | Исправлено: WONDROUS, 16:28 18-03-2020
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Подскажите, пожалуйста, как правильно для этой кнопки написать в CSS свойства для подсказки (tooltip)? Вопрос в том, что если делать ширину кнопки на всю ширину, например, страницы или ещё чего, то она не растягивается по ширине. И в пример по ссылке кнопка должна быть на всю ширину.

Всего записей: 2661 | Зарегистр. 30-06-2002 | Отправлено: 01:15 09-04-2020 | Исправлено: WONDROUS, 01:16 09-04-2020
Mavrikii

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS

Цитата:
то она не растягивается по ширине

"она" - подсказка? и не будет растягиваться, так как она не использует ширину кнопки и цепляется как отдельный элемент с абсолютным позиционированием. для этого нужно править js скрипт, создающий подсказку, чтобы измерял ширину элемента и выставлял такую же подсказке. может он это умеет изначально - нужно смотреть его доки.
а так ширина подсказки всецело опеределяется лишь ее содержимым.

Всего записей: 8910 | Зарегистр. 20-09-2014 | Отправлено: 01:20 09-04-2020 | Исправлено: Mavrikii, 01:21 09-04-2020
VVL99



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS
http://klikr.org/b303cdc387b53eb223948ea2d094.png

Всего записей: 3451 | Зарегистр. 03-02-2011 | Отправлено: 01:28 09-04-2020
Mavrikii

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
VVL99
снова вы не читаете вопрос.

Всего записей: 8910 | Зарегистр. 20-09-2014 | Отправлено: 01:40 09-04-2020
VVL99



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Согласен.

Всего записей: 3451 | Зарегистр. 03-02-2011 | Отправлено: 01:57 09-04-2020
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Нет, вопрос бы именно про ширину кнопки, но спасибо за ответ.
 
VVL99
Спасибо за ответ и скриншот!

Всего записей: 2661 | Зарегистр. 30-06-2002 | Отправлено: 14:15 09-04-2020
Mavrikii

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS

Цитата:
Нет, вопрос бы именно про ширину кнопки

Тогда зачем упомянули подсказку, появляющуюся при наведении на кнопку?
Развели воды, вместо одного вопроса - как сделать кнопку 100% ширины.
 
VVL99
Сорри

Всего записей: 8910 | Зарегистр. 20-09-2014 | Отправлено: 15:43 09-04-2020
VVL99



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
написать в CSS свойства для подсказки (tooltip)?

Цитата:
И в пример по ссылке кнопка должна быть на всю ширину.
Очень запутанная формулировка, суть вопроса меняется в зависимости от внимательности и подготовленности читающего.
WONDROUS
Вам надо попробовать себя в создании логических игр, у вас похоже к этому есть задатки.

Всего записей: 3451 | Зарегистр. 03-02-2011 | Отправлено: 15:51 09-04-2020
Открыть новую тему     Написать ответ в эту тему

Страницы: 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 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94

Компьютерный форум Ru.Board » Интернет » Web-программирование » Вопросы по CSS

Имя:
Пароль:
Сообщение

Для вставки имени, кликните на нем.

Опции сообщенияДобавить свою подпись
Подписаться на получение ответов по e-mail
Добавить тему в личные закладки
Разрешить смайлики?
Запретить коды


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.Board
© Ru.Board 2000-2020

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru

Рейтинг.ru