семантический интерфейс реагирует на мобильные компоненты - PullRequest
0 голосов
/ 02 января 2019

Я использую semantic-ui-реакции для своего сайта.Я хочу сделать все компоненты мобильными.Но когда я смотрю на мобильный сайт, все элементы отображаются очень маленькими.Пожалуйста, найдите изображение ниже:

enter image description here

Как сделать элементы больше на мобильных устройствах?Также я хочу адаптивное меню для мобильной версии.Может кто-нибудь, пожалуйста, дайте мне знать?

Спасибо

Ответы [ 3 ]

0 голосов
/ 02 января 2019

Убедитесь, что в вашем HTML есть соответствующий тег meta между <head></head> и, конечно же, ссылка на CSS (импорт в js тоже подойдет):

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

<link
  rel="stylesheet"
  href="//cdn.jsdelivr.net/npm/semantic-ui@2.4.1/dist/semantic.min.css"
/>
0 голосов
/ 03 января 2019

Спасибо Laurens Deprost за помощь!

Я исправил эту проблему.На самом деле было 2 проблемы.

Первое, что я использовал переадресацию домена от Godaddy с включенной маскировкой.Из-за этого весь сайт отображался внутри набора фреймов, и медиа-запросы не работали.Чтобы исправить это, я добавил собственный домен в Heroku и использовал его в качестве записи CNAME в godaddy.

Затем я также применил css с медиа-запросами отсюда: https://gist.github.com/phuphighter/ce980aaec1c7104846f7e944743a7e07

С этими двумя исправлениямисайт работает нормально.

Спасибо

0 голосов
/ 02 января 2019

у вас уже есть этот метатег <meta name="viewport" content="width=device-width, initial-scale=1"> в вашем HTML? Я думаю, что этого просто не хватает.

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