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

Новости • Файловые архивы
Поиск • Активные темы • Топ лист
Правила • Кто в 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 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129

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

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

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

GEGEMON BANNED	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору del
	Всего записей: 2820 \| Зарегистр. 07-02-2006 \| Отправлено: 08:24 29-10-2018 \| Исправлено: GEGEMON, 13:08 29-10-2018

WONDROUS Silver Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Mavrikii Спасибо, работает.
	Всего записей: 3440 \| Зарегистр. 30-06-2002 \| Отправлено: 13:58 29-10-2018

WONDROUS

Silver Member

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

Что-то немного не соображу, как сделать, чтобы пульсирующие круги при наведении курсора не показывались:
HTML

Код:

CSS
Подробнее...

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 14:48 01-11-2018

Mavrikii

Platinum Member

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

WONDROUS
ну будущее - создавайте проект на jsfiddle или ином ресурсе, чтобы сэкономить чужое время для проверки.

Код:

.plus:hover:before,
.plus:hover:after {
animation: none;
}

Всего записей: 15684 | Зарегистр. 20-09-2014 | Отправлено: 21:13 01-11-2018

WONDROUS Silver Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Mavrikii Понятно, спасибо. hover писал не там, поэтому не работало.
	Всего записей: 3440 \| Зарегистр. 30-06-2002 \| Отправлено: 00:23 02-11-2018

b7music Advanced Member	Редактировать \| Профиль \| Сообщение \| ICQ \| Цитировать \| Сообщить модератору подскажите, как поправить https://i.imgur.com/mzb49Jw.gifv nbs22.ru
	Всего записей: 684 \| Зарегистр. 04-03-2010 \| Отправлено: 07:05 12-11-2018

Mavrikii

Platinum Member

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

b7music

Цитата:

подскажите, как поправить

словами опишите
если по поводу появления верхнего меню, то проблема в том, как вы прячете выдающее верхнее меню - оно фактически присутствует и поэтому перехватывает мышь над собой. делайте ему, как и писал, display: none, а по hoverу верхнего меню убирайте/выставляете block или что вам там нужно - тогда проблем не будет

вот, вы его не прячете изначально при загрузке страницы (оно лишь под баннером лежит)

.mega-menu table .dropdown-menu
дописать display: none

Всего записей: 15684 | Зарегистр. 20-09-2014 | Отправлено: 07:23 12-11-2018 | Исправлено: Mavrikii, 07:57 12-11-2018

WONDROUS

Silver Member

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

Заметил такую ерунду, что box-shadow по-разному показывается в разных браузерах при увеличении масштаба. В Firefox нормально круги отображаются, в Safari и Chrome размыты (в Chrome даже больше размытости). Ширину кругов в box-shadow делал в px и em, разницы не видно. Как это исправляется?

Код:

box-shadow: 0 0 1px 1em rgba(138, 59, 88, 0.4), 0 0 1px 2em rgba(138, 59, 88, 0.1), 0 0 1px 3em rgba(138, 59, 88, 0.1);
}

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

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 16:41 12-11-2018 | Исправлено: WONDROUS, 21:59 12-11-2018

Mavrikii Platinum Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору WONDROUS 1) пример показывайте целиком 2) отрисовка зависит от движка браузера, а не особенностей css
	Всего записей: 15684 \| Зарегистр. 20-09-2014 \| Отправлено: 22:19 12-11-2018

WONDROUS

Silver Member

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

Mavrikii
В сообщении ссылка на страницу.
Оно одинаково размыто показывается при увеличении масштаба, в любом браузере. Сама кнопка (круг) при увеличении выглядит нормально.

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 22:39 12-11-2018

Mavrikii

Platinum Member

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

WONDROUS
я не понимаю в чем ваша проблема.
Firefox:

Chrome:

с моей точки зрения в Firefox размыто

это не имеет никакого отношения к CSS, а лишь особенности графического движка браузера

Всего записей: 15684 | Зарегистр. 20-09-2014 | Отправлено: 23:13 12-11-2018 | Исправлено: Mavrikii, 23:14 12-11-2018

WONDROUS

Silver Member

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

Просьба подсказать, как в этом коде сделать так, чтобы %slice% был вертикально по центру.

Код:

<div style="height: 500px; background: radial-gradient(ellipse at bottom, #1b2735 0%, #090a0f 100%);">
<div id="stars"></div>
%slice%
<div id="stars2"></div>
<div id="stars3"></div>
</div>

Высоту и фон потом перенесу в css.

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 23:35 17-11-2018

Mavrikii Platinum Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору WONDROUS во первых - его нужно обернуть в блочный элемент, который и будет позиционироваться. https://css-tricks.com/centering-css-complete-guide/
	Всего записей: 15684 \| Зарегистр. 20-09-2014 \| Отправлено: 00:19 18-11-2018

GEGEMON

BANNED

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

Mavrikii
Будьте любезны, как убрать это

Ссылка

добавлено

сделал в процентах

Код:

.mcd-menuss li {
float: left;
width: 14%;
position: relative;
}

на разных девайсах нормально отображается, но второй уровень сбился, поправить не умею. Помогайте пжст

Всего записей: 2820 | Зарегистр. 07-02-2006 | Отправлено: 13:38 25-11-2018 | Исправлено: GEGEMON, 14:26 25-11-2018

Mavrikii

Platinum Member

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

GEGEMON
не совсем понял что за мелкие выступы отмечены, не вижу их.

Цитата:

но второй уровень сбился, поправить не умею

ну поиск не убирается, а иконка сползает ниже меню.
хотите в одну строчку - white-space: nowrap;
но я проблемы не наблюдаю

Всего записей: 15684 | Зарегистр. 20-09-2014 | Отправлено: 20:29 25-11-2018

GEGEMON BANNED	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Mavrikii поиск мне не нужен, я убрал его. Посмотрите здесь пжст, второй уровень Ссылка
	Всего записей: 2820 \| Зарегистр. 07-02-2006 \| Отправлено: 20:36 25-11-2018 \| Исправлено: GEGEMON, 20:39 25-11-2018

Mavrikii

Platinum Member

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

GEGEMON
1) для всех ul в меню нужно

Цитата:

list-style: none;
padding: 0;
margin: 0;

2) вы же указали для всех li ширину в 14%, вот вам и результат - в выпадающем меню содержимое (так как находится во вложенном li) тоже занимает 14%. хотите иначе - применяйте ширину только к li корневого ul
3) насчет равномерного распределения объектов - https://css-tricks.com/equidistant-objects-with-css/
лучше получается не через float: left, а через display: table и table-cell, или flexbox

Всего записей: 15684 | Зарегистр. 20-09-2014 | Отправлено: 20:40 25-11-2018 | Исправлено: Mavrikii, 20:55 25-11-2018

GEGEMON BANNED	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору А ткните пжст номер строки на кодепен этого корневого ul
	Всего записей: 2820 \| Зарегистр. 07-02-2006 \| Отправлено: 21:09 25-11-2018 \| Исправлено: GEGEMON, 21:14 25-11-2018

Mavrikii Platinum Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору GEGEMON тот, который с классом .mcd-menuss применить только к его прямым li потомкам через .mcd-menuss>li
	Всего записей: 15684 \| Зарегистр. 20-09-2014 \| Отправлено: 21:15 25-11-2018

GEGEMON

BANNED

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

Mavrikii

Цитата:

тот, который с классом .mcd-menuss

такого нету только с li ul есть

Код:

.mcd-menu li ul,
.mcd-menu li ul li ul {
position: absolute;
height: auto;
min-width: 200px;
padding: 0;
margin: 0;
background: #FFF;
border-top: 4px solid #e67e22;
opacity: 0;

т.е. если я что-то понял (ибо ламер) будет так

Код:

.mcd-menu li ul li ul {
position: absolute;
height: auto;
min-width: 200px;
padding: 0;
margin: 0;
background: #FFF;
border-top: 4px solid #e67e22;
opacity: 0;
}
.mcd-menuss ul>li {
list-style: none;
padding: 0;
margin: 0;
position: absolute;
height: auto;
min-width: 200px;
padding: 0;
margin: 0;
background: #FFF;
border-top: 4px solid #e67e22;
opacity: 0;
}

Всего записей: 2820 | Зарегистр. 07-02-2006 | Отправлено: 21:46 25-11-2018

Страницы: 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 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129

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

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

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC