2016-09-30 3 views
1

Я строю сайт, на котором много тематики и стиля основано на Bootstrap 3. Но я хочу использовать такие вещи, как «Множественные выборки», которые доступны в Semantic UI, но не так в Bootstrap. Я думаю, что слишком поздно переносить проект полностью на Semantic UI. Кроме того, я знаю, что между этими структурами существует значительный конфликт имен. Поэтому использование Semantic UI рядом с Bootstrap не похоже на хорошую идею. Так что я могу сделать? Мой вопрос в два раза.Использование семантических элементов пользовательского интерфейса в проекте, основанном на Bootstrap

  1. Semantic UI предлагает установку с помощью Node JS. Может ли Semantic UI использоваться в проекте с фоном PHP?

  2. я не могу просто использовать исходный код для этих элементов из Semantic UIGithub репо и использовать его в моем проекте фактически не нужно устанавливать Semantic UI?

ответ

5

[Ответ может быть поздний]

У меня есть опыт по использованию раскрывающегося плагина семантического пользовательского интерфейса в начальной загрузке проекте.

Вы можете просто включить четыре компонента, чтобы заставить его работать, они:

Кроме того, вам нужно будет добавить некоторые css для стилизации этикетки (потому что это comflict wi й бутстрап) и сделать значок удаления. Вот рабочий пример я сделал в codepen: http://codepen.com/cambyliverson/pen/mRreXo

Если вы как семантический-интерфейс, вы можете рассмотреть семантическую-щий кожу бутстрапа: SMTB

+0

Благодаря мельнице, это мне очень помогли! –

+0

Это решило мою проблему, спасибо –

1
  1. Вы можете использовать композитор установить смысловую-интерфейс, а также. Дополнительная ссылка: https://packagist.org/packages/semantic/ui

  2. NodeJS является предпочтительным, поскольку вы можете использовать его для создания файлов с требуемым типом компонентов. Если у вас установлен NodeJS, вы можете использовать интерактивный установщик , чтобы просто собрать и собрать соответствующие файлы для вас. http://semantic-ui.com/introduction/getting-started.html#install-semantic-ui

  3. Вы также можете использовать CDN для конкретных элементов: https://cdnjs.com/libraries/semantic-ui

  4. Вы также можете использовать GitHub репо, чтобы просто выбрать элементы, которые вам нужны, но всегда рекомендуется использовать сборку чтобы вы могли скомпилировать все ваши файлы CSS (или файлы JS) в один.

P.S. Чтобы избежать конфликтов пространства имен для используемых вами элементов, например, вы можете переименовать все ключевые слова modal с semantic-modal в свои semantic.js и semantic.css. Вы можете сделать это со всеми другими элементами, которые имеют конфликт имен.

0

Как общее правило, я бы сказал, не делай этого. Они CSS участие в 2 проектах может легко конфликтов и привести к таким вещам ...

https://slack-files.com/T0VNSF68H-F4NL9M950-ae64b77fc1

^GIF модального подпрыгивая и сверкая из-за конфликтующих CSS