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

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в 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
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS
что значит "впереди"?

Всего записей: 15689 | Зарегистр. 20-09-2014 | Отправлено: 10:27 22-12-2018
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Если написать "перед", так будет правильнее? На переднем плане tops, за ним/ней twist, и всё по центру.

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

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS
одно над другим - значит без абсолютного позиционирования не обойтись.
ценитрируете один элемент как родитель, второй с центровкой и использованием абсолютного позиционирования - потомок.

Всего записей: 15689 | Зарегистр. 20-09-2014 | Отправлено: 11:01 22-12-2018
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Один релатив, другой абсолют? Пробовал, оно почему-то не по центру получалось.
 
Добавлено:
Если делать так, то в редакторе картинка по центру другой, но при просмотре и в браузере их вообще не видно.

Код:
.twist {
text-align: center;
z-index: 1;
}
 
.tops {
text-align: center;
position: relative;
}
 
.tops img {
position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
max-width: %id=tops_size%px;
z-index: 2;
}

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



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
В общем, намудрил, наверное, но так передняя картинка (tops) по центру встала, но зато они обе сместили вправо на несколько пикселей, то есть, не по центру экрана. Если оставлять только заднюю картинку (twist), она по центру, но стоит добавить переднюю, они смещаются.




Нарушение п. 2.8.3. главы VIII Соглашения по использованию

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 13:39 23-12-2018 | Исправлено: WONDROUS, 03:58 21-01-2019
Mavrikii

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

Цитата:
Больше некому подсказать?

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

Всего записей: 15689 | Зарегистр. 20-09-2014 | Отправлено: 14:42 23-12-2018
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Хотел спросить, как правильно указывать размеры для небольших экранов, надо ли сейчас указывать разную ширину для разных устройств/экранов (480px, 600px, 768px)? Или для тех же смартфонов и планшетов достаточно указать @media only screen and (max-width: 600px)?

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 04:03 21-01-2019 | Исправлено: WONDROUS, 04:16 21-01-2019
Mavrikii

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

Цитата:
надо ли сейчас указывать разную ширину для разных устройств/экранов

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

Всего записей: 15689 | Зарегистр. 20-09-2014 | Отправлено: 09:18 21-01-2019
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Хорошо, но если уже есть max-width: 600px, надо для всяких смартфонов ещё и max-width: 480px указывать? Или лишним не будет?

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 16:33 21-01-2019
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS
смотрим как будет выглядеть при разных ширинах, если что то выглядит не так - смотрим при какой ширине, добавляем изменения в css, уменьшает ширину дальше. так доходите до того минимума, что можете вытянуть.
 
я просто уменьшаю ширину, нахожу что вызывает проблему, добавляю параметры переписывающее этот "дефект". вытягиваю до 300-400 пикселей, не меньше. можете ограничиться какой то шириной больше, но могут быть проблемы с близкими ссылками и мелким шрифтом (гугл скажет, если есть аккаунт в утилитах вебмастера)

Всего записей: 15689 | Зарегистр. 20-09-2014 | Отправлено: 16:43 21-01-2019 | Исправлено: Mavrikii, 16:53 21-01-2019
TheBarmaley



Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS
Цитата:
Или лишним не будет?
смотря как укажешь - исходим из первой буквы сабжа - последнее определение перекроет предыдущее при прочих равных..)

----------
..the one of.. ··· ..sam-&-pol..

Всего записей: 17876 | Зарегистр. 07-06-2006 | Отправлено: 16:48 21-01-2019
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
TheBarmaley
Как-то так:
 
@media only screen and (max-width: 600px) { код }
 
@media only screen and (max-width: 480px) { код }

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 16:55 21-01-2019
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS
пусть у вас ширина 400.
сработает сначала
Цитата:
@media only screen and (max-width: 600px) { код }  

затем

Цитата:
@media only screen and (max-width: 480px) { код }

если у вас при 400 все выглядит хорошо как и при 600, то ничего добавлять не нужно.
если же при какой то ширине возникают "нехорошести" - добавляете условие на эту ширину (как я и описал выше)

Всего записей: 15689 | Зарегистр. 20-09-2014 | Отправлено: 17:00 21-01-2019 | Исправлено: Mavrikii, 17:01 21-01-2019
GEGEMON



BANNED
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
пытаюсь добавить значок awesome , в fonts.css добавил .fa-map:before{content:"\f279"}
в само меню <i class="fa fa-map"></i>  - значок не видатЬ, но место под него обозначено. Все другие из шаблона нормально отображаются

Всего записей: 2820 | Зарегистр. 07-02-2006 | Отправлено: 17:14 21-01-2019
Mavrikii

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

Цитата:
fa fa-map

far fa-map или fas fa-map
https://fontawesome.com/icons/map?style=solid
https://fontawesome.com/icons/map?style=regular

Всего записей: 15689 | Зарегистр. 20-09-2014 | Отправлено: 17:19 21-01-2019 | Исправлено: Mavrikii, 17:20 21-01-2019
GEGEMON



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

Цитата:
far fa-map или fas fa-map  

по любому не работает

Всего записей: 2820 | Зарегистр. 07-02-2006 | Отправлено: 17:37 21-01-2019
Mavrikii

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

Цитата:
по любому не работает

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

Всего записей: 15689 | Зарегистр. 20-09-2014 | Отправлено: 17:41 21-01-2019
GEGEMON



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

Всего записей: 2820 | Зарегистр. 07-02-2006 | Отправлено: 17:47 21-01-2019 | Исправлено: GEGEMON, 17:50 21-01-2019
Mavrikii

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

Всего записей: 15689 | Зарегистр. 20-09-2014 | Отправлено: 17:50 21-01-2019
GEGEMON



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

Цитата:
что не так?

так стало после того как я подключил таблицу стилей ))  
до того парил без неё. Только сейчас еще лучше.  
Потому и поблагодарил за ссылку

Всего записей: 2820 | Зарегистр. 07-02-2006 | Отправлено: 18:12 21-01-2019 | Исправлено: GEGEMON, 18:14 21-01-2019
Открыть новую тему     Написать ответ в эту тему

Страницы: 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

Рейтинг.ru