Веб-разработка / Эмуляция интерфейса iPhone с помощью CSS
Некоторое время назад мне потребовалось «красиво» оформить логи бесед в жаббире. Поскольку рисовать я не умею вовсе, я обратился за подмогой к мирозданию. Поиск по готовым решениям открыл для меня малоизвестную, но, безусловно, заслуживающую внимания библиотечку. Строго говоря, это не библиотека. Это тщательно написанная и выверенная каскадная таблица стилей, позволяющая имитировать iPhone-интерфейс в браузерах.
Координатные данные проекта UiUiKit (Universal iPhone UI Kit):
- Сайт автора: www.minid.net
- SVN URL: code.google.com/p/iphone-universal/source/checkout
- Download: code.google.com/p/iphone-universal/downloads/list
webkit'а. Я пропатчил CSS директивами для остальных и развернул демонстрационную страничку, чтобы можно было сразу потыкать в элементы интерфейса.
Выглядит симпатично (на картинке в начале топика — скриншот моего браузера). Приятного использования!Источник: Уроки CSS на Хабрахабре
На основе данноо фреймворка "по-быстрому" сверстал шаблон для DLE
Если Вы хотите оставить заказ на разработку сайта или получить предварительную консультацию воспользуйтесь формой по ссылке ниже.
Обратная связь
Наш специалист ответит вам в течении суток.
Похожие публикации
[Перевод] Я решил отключить Google AMP на своём сайте
Меня связывает с проектом Google’s Accelerated Mobile Pages (AMP) долгая история, но вчера чаша терпения переполнилась. Я зашёл в Twitter (в Safari на iPhone 6) и заметил, что кто-то сослался на мой... читать далее
Как сделать сайт более iPhone-совместимым за 5 шагов
Тот факт, что iPhone предлагает наиболее развитый мобильный браузер среди мобильных платформ, пожалуй, ни у кого не вызовет сомнений. Однако не все знают, что довольно небольшими усилиями можно сайт... читать далее
Адаптивный дизайн против Мобильных версий сайта
Адаптивным («отзывчивым», Responsive) называют дизайн, который проектируется и разрабатывается таким образом, что сайт становится совместимым с любым устройством, которое может быть использовано для... читать далее
Могут ли PWA (Progressive Web Apps) образца 2018 года составить достойную конкуренцию нативным приложениям?
Когда изменения происходят постепенно, шаг за шагом, порой бывает трудно заметить насколько они драматичны и всеобъемлющи. Казалось бы всего несколько лет назад web платформа проигрывала нативным... читать далее
Google / В индекс Google по кнопке
Google запустил новый сервис «On-Demand Indexing» для вебмастеров, которые установили поиск от Google у себя на сайте. Сервис позволяет вебмастеру самостоятельно «сказать» когда нужно... читать далее
Блог им. ekwo / Привязываем иконку к каждому типу файлов на CSS
Предположим, что нам нужно сделать страничку, на которой будут выкладываться файлы разных типов (архивы, картинки, документы), и при этом мы хотим, чтобы каждый тип файла выделялся, но для того,... читать далее
Комментарии (1)
Прокомментировать
Облако тегов
angular css CSS es6 frontend habrahabr.ru HTML html html5 JavaScript javascript js react ReactJS seo SEO на Хабрахабре vue Блог компании RUVDS.com Веб-дизайн Интернет-маркетинг Поисковая оптимизация Программирование Разработка веб-сайтов Уроки CSS на Хабрахабре автомобильный сайт блог браузеры верстка вёрстка дайджест интернет-магазин информационный ресурс корпоративный сайт модуль мы рекомендуем портфолио разработка ссылки фронтенд
Реклама на сайте
Prime Capitals . Веб-студия https://hover.com.ua/ в Киеве . Источник: http://review-gadget.com/3648-lg-letom-nachnet-massovoe-proizvodstvo-gibkih-oled-displeev.