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


Система IP-видеонаблюдения "Линия". Скачать бесплатную демо-версию для 16 камер. НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в 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

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

Mavrikii

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS
http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css

Цитата:
[class^="icon-"], [class*=" icon-"]
и так далее
как видите, грузится с CDN, поэтому сам файл не измените, но можете переписать стилем в доступном вам css файле.
и если нужно именно разноцветными каждую звезду или у каждого пользователя разные цвета, то нужно менять и код генерящий страницу, чтобы менять стили и у каждой копии стиля свой цвет.

Всего записей: 4911 | Зарегистр. 20-09-2014 | Отправлено: 10:06 06-06-2017
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Там можно изменить цвет, дописав эти строки, но они работают, только если прописать их в файле comments.css. Просто, это стек для веб-редактора и в самой программе есть возможность вносить изменения или дополнения в CSS, и было бы удобнее в самой программе сразу сделать этот код работающим, а не изменять потом отдельный файл CSS.

Код:
.stars {
color: #FF8B00;
}
 
.user-rating {
color: #FF8B00;
}

Всего записей: 2174 | Зарегистр. 30-06-2002 | Отправлено: 11:07 06-06-2017 | Исправлено: WONDROUS, 11:07 06-06-2017
Weinaum



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
 
спасибо, пришлось срочно уехать, поэтому не сразу отвечаю, сорри -  
я конечно же работаю с панелью разработчика, куда ж без этого, правый монитор полностью только под панель и редактор кода. Иногда вот просто смотришь и не видишь то что на поверхности лежит.)  
 
Еще раз спасибо, особо за
Цитата:
а основная причина в том, что bootstrap добавляет это  
 
Цитата:
* {  
  -webkit-box-sizing: border-box;  
  -moz-box-sizing: border-box;  
  box-sizing: border-box;  
}
 

 

Всего записей: 1864 | Зарегистр. 18-06-2006 | Отправлено: 12:23 06-06-2017 | Исправлено: Weinaum, 12:23 06-06-2017
vs6262



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

Цитата:
но можете переписать стилем  

тоже хотел было сказать, забыл

Всего записей: 1280 | Зарегистр. 25-02-2013 | Отправлено: 00:57 07-06-2017
Weinaum



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
 
Вчера разработчик откорректировал стили, теперь вроде бы страница выпрямилась, спасибо )
ссылка
Пару моментов вижу, в принципе, решение тоже вижу, но не понятны причины, хотелось бы узнать (как в случае с "bootstrap добавляет свое" )
Речь вот о чем -  
при просмотре в мобильном разрешении именно для первого продукта заголовок и текст кнопки не выровнен по центру. Непонятно, почему именно для первого элемента такое.
 
И второе - перебился цвет фона для body - в принципе, я вижу, что  перебито bootstrap-овским scaffolding.less, и видимо, перебивает потому, что bootstrap-овские стили подключаются после стилей темы - stylesheet.css.
Задумался вот о чем. В ближайшее время намечено изменение еще нескольких страниц данного сайта, и все они связаны с респонсивной версткой. Изначально пошел по пути наименьшего сопротивления, и просто везде добавляю bootstrap. Хотя у них какой то свой респонсив вроде даже внедрен, но много где не работает или работает криво.  
Теперь разрабы на xtcommerce добавляют bootstrap прямо в теле страницы. Соотв-но он подключается позже чем стили темы.  
Так вот, есть ли какой то иной способ, заставить bootstrap подключаться раньше, кроме как прямо прописать его в head перед stylesheet.css?  
 
 
 
 
 

Всего записей: 1864 | Зарегистр. 18-06-2006 | Отправлено: 10:14 09-06-2017
Mavrikii

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

Цитата:
 кроме как прямо прописать его в head перед stylesheet.css?

без участия js - нет

Цитата:
Речь вот о чем -  
при просмотре в мобильном разрешении именно для первого продукта заголовок и текст кнопки не выровнен по центру. Непонятно, почему именно для первого элемента такое.

на скриншотах показывайте, чтобы было понятно на что смотреть

Всего записей: 4911 | Зарегистр. 20-09-2014 | Отправлено: 10:51 09-06-2017
Weinaum



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

Цитата:
на скриншотах показывайте, чтобы было понятно на что смотреть

 
вот об этом речь -  

 

Цитата:
без участия js - нет  

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

 
пункты меню поприжимались влево, по сравнению с остальными страницами.
Вижу, что тоже bootsprap добавил...
 
 
 

Всего записей: 1864 | Зарегистр. 18-06-2006 | Отправлено: 13:00 09-06-2017
Mavrikii

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

Цитата:
вот об этом речь -  
 

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

Всего записей: 4911 | Зарегистр. 20-09-2014 | Отправлено: 13:14 09-06-2017
Weinaum



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
странно. Нет, рамки на скрине подрисовал, для наглядности..
Ну да ладно, в принципе, вижу как пофиксить.  
Кстати, тоже бутстрап чудит,надо плотнее разобраться, почистить его..

Всего записей: 1864 | Зарегистр. 18-06-2006 | Отправлено: 15:28 09-06-2017
Mavrikii

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

Цитата:
странно. Нет, рамки на скрине подрисовал, для наглядности

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

Всего записей: 4911 | Зарегистр. 20-09-2014 | Отправлено: 15:42 09-06-2017
Weinaum



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
<479, хром, фф - сейчас почему "плывет" второй продукт, точнее - ZEBRA DS8178 HANDSCANNER  - и заоголовок и кнопка, а первый только заголовок.

Всего записей: 1864 | Зарегистр. 18-06-2006 | Отправлено: 15:58 09-06-2017
Mavrikii

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

Код:
@media (max-width: 479px)
a.product-name {
   float: left;
    text-align: center;
    padding-bottom: 20px;
}

float не центрируется. и синяя кнопка смещена вправо

Всего записей: 4911 | Зарегистр. 20-09-2014 | Отправлено: 16:11 09-06-2017 | Исправлено: Mavrikii, 16:11 09-06-2017
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Существует ли какой-то универсальный способ (код), чтобы сделать какой-то элемент поверх другого? Иногда код (с z-index и position) работает, иногда нет.

Всего записей: 2174 | Зарегистр. 30-06-2002 | Отправлено: 20:55 11-06-2017
R3Pa4eK



Advanced Member
Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
WONDROUS
Что значит "иногда работает, иногда нет"? Если всё сделать правильно, то два абсолютно (как и относительно, кажется) с позиционированных блока будут правильно работать с z-index. А вообще, покажите код в тех случаях, когда работает, и в тех, когда нет.

----------
I'm so ugly, that's okay....

Всего записей: 963 | Зарегистр. 15-01-2011 | Отправлено: 21:48 11-06-2017
vs6262



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

Код:
.btn {
  background: #3498db;
   
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
   
   
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0px;
  -webkit-box-shadow: 0px 1px 3px #666666;
  -moz-box-shadow: 0px 1px 3px #666666;
  box-shadow: 0px 1px 3px #666666;
  font-family: Calibri;
  color: #ffffff;
  font-size: 16px;
  padding: 4px;
  text-decoration: none;
   
  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */
 
   
  -o-user-select: none;
  user-select: none;
}
 
.btn:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
}

нужно falback решение для IE8, IE9 (так чтобы автоматом всё полностью работало бы)
может кто поможет ?
http://www.a-breil.de/ - потом ссылку уберу
 
Добавлено:

Код:
<!--[if lt IE 8]>
    <link rel="stylesheet" type="text/css" href="ie8.css" />
<![endif]-->

в каком разделе в HTML разместить такой блок ?

Всего записей: 1280 | Зарегистр. 25-02-2013 | Отправлено: 02:00 30-06-2017 | Исправлено: vs6262, 02:16 30-06-2017
vs6262



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

Всего записей: 1280 | Зарегистр. 25-02-2013 | Отправлено: 04:28 30-06-2017
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Я, конечно, извиняюсь, но есть вопрос, как правильнее и проще сделать из прямоугольной картинки квадратную, изменив размер в пикселях, чтобы потом в круг поместить (border-radius)?

Всего записей: 2174 | Зарегистр. 30-06-2002 | Отправлено: 23:15 16-08-2017
Mavrikii

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

Цитата:
проще сделать из прямоугольной картинки квадратную

зачем? поместить ее фоном по центру - сама обрежется
https://jsfiddle.net/5ks7r5fL/
https://jsfiddle.net/5ks7r5fL/1/
https://jsfiddle.net/5ks7r5fL/2/

Всего записей: 4911 | Зарегистр. 20-09-2014 | Отправлено: 23:20 16-08-2017 | Исправлено: Mavrikii, 23:27 16-08-2017
b7music



Full Member
Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
Всем привет! Ребят, подскажите, можно ли как-нибудь подружить попап с z-index и overflow-y?
http://prntscr.com/gewfde вот как выглядит.

----------
https://nbs22.ru -
Запчасти и аксессуары

Всего записей: 501 | Зарегистр. 04-03-2010 | Отправлено: 15:05 30-08-2017
Mavrikii

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

Цитата:
Ребят, подскажите, можно ли как-нибудь подружить попап с z-index и overflow-y?  

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

Всего записей: 4911 | Зарегистр. 20-09-2014 | Отправлено: 20:30 30-08-2017
Открыть новую тему     Написать ответ в эту тему

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

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

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

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

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


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

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

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru