Форум программистов, компьютерный форум, киберфорум
Наши страницы
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
cenationn
1 / 1 / 0
Регистрация: 27.03.2013
Сообщений: 83
1

Меню для моб. устройства

27.02.2017, 12:43. Просмотров 97. Ответов 0
Метки нет (Все метки)

Пытаюсь разобраться с меню для моб. устройства. Подскажите пожалуйста, как можно сделать его самым простым способом, как на скриншотах ниже.
HTML5
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
<html>
<head>
<meta charset="utf-8" />
<title>Test</title>
<style>
.h_panel {height:46px; 
          position:relative;
          z-index:104;
          }
.h_nav_wrap a {text-decoration:none;}
.h_nav > li {position:relative; float:left; margin:0 0 0 5px;}
.h_nav > li > a,.h_nav > li > span{
         height:46px;
         line-height:43px;
         padding:0 7px; 
         display:block;
         overflow:hidden;
         font-size:15px;
         color:#262626;
         text-align:center;
         cursor:pointer;}
.h_nav {float:left;}
.h_user {float:right;}
nav ul, nav li, .h_nav_wrap ul, .h_nav_wrap li {
    display: block;
    padding: 0px;
    margin: 0px;
    list-style: none outside none;
    background: none repeat scroll 0px center transparent;
}
</style>
</head>
<body>
<div class="h_panel">
  <div class="wrapper">
   <nav class="h_nav_wrap">
    <ul class="h_nav">
     <li><a href="/">Ссылка</a></li>
     <li><a href="/">Ссылка</a></li>
     <li><a href="/">Ссылка</a></li>
     <li><a href="/">Ссылка</a></li>
     <li><a href="/">Ссылка</a></li>
    </ul> 
<ul class="h_nav h_user">
    <li><a href="#">Вход</a></li>
    <li><a href="#">Регистрация</a></li>
</ul>
   </nav>
  </div>
 </div>
</body>
</html>
0
Миниатюры
Меню для моб. устройства   Меню для моб. устройства  
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
27.02.2017, 12:43
Ответы с готовыми решениями:

Необходимо адаптировать галерею под моб. устройства
Ни как не могу понять как изменить размер галереи Simple Image Gallery в...

Адаптивное выезжающее меню на Bootstrap всегда открыто в моб.версии
Само меню имеет такую структуру &lt;div class=&quot;navbar-header&quot;&gt; &lt;button...

Сайт для ПК и моб. платформ
Есть сайт на нём форма регистрации на андроиде с oper'ы отображается норм (т.е....

Адаптация меню под мобильные устройства
Добрый день! Хочу попросить совета в одном вопросе - у меня есть меню (1 и 2 на...

Выпадающее меню - разный размер шрифта для разных уровней меню
Есть у меня данный список, но возник вопрос: &quot;как сделать чтобы в надписи...

0
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
27.02.2017, 12:43

Масштаб, размер страницы на моб. устройств
Опять нужна ваша помощь добрые и опытные верстальщики! Уже чуть ли не неделю...

Реализация dropdown menu на моб. устройствах
Доброго времени суток, делаю выпадающее меню на bootstrap и столкнулся с...

Адаптивный дизайн под высокие моб. разрешения
Здравствуйте. Адаптивный дизайн - это хорошо, а вот мобилки с разрешением...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
1
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru