X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость ( Вход | Регистрация )

Открыть тему
Тема закрыта
> Ищу адаптивный щаблон, желателньо чистый HTML
sanika
sanika
Topic Starter сообщение 29.10.2014, 15:01; Ответить: sanika
Сообщение #1


Бывалый
****

Группа: User
Сообщений: 378
Регистрация: 5.1.2011
Поблагодарили: 96 раз
Репутация:   9  


Хочу разобраться как это работает, может кто знает где можно найти какой-то шаблон, работающий по принципу отображения на разных расширениях:



Хочу разобраться как он работает, а то с @media все понятно, а как на практике выглядит - не понимаю. Это возможно лишь при верстке дивами или табличная тоже может быть адаптивной?

Сообщение отредактировал sanika - 29.10.2014, 15:03


Поблагодарили: (1)
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
allvake
allvake
сообщение 29.10.2014, 15:22; Ответить: allvake
Сообщение #2


Завсегдатай
*****

Группа: Active User
Сообщений: 594
Регистрация: 16.8.2011
Из: South
Поблагодарили: 272 раза
Репутация:   37  


Берите любые клубные шаблоны, если cms не мешает, и разбирайте smartaddons.com/joomla/templates/template-showcase или joomlart.com/joomla/templates
а лучше возьмите шаблон, адаптирован под все устройства http://t3-framework.ru/

Сообщение отредактировал allvake - 29.10.2014, 15:22


Поблагодарили: (3)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
fredditton
fredditton
сообщение 29.10.2014, 15:27; Ответить: fredditton
Сообщение #3


Участник
***

Группа: User
Сообщений: 147
Регистрация: 17.10.2014
Поблагодарили: 27 раз
Репутация:   8  


Искал такой под Wordpress - не нашел. Сделал просто масштабируемый, что на смартах смотрится вообще не кликабельно. Суть в чем - у меня таблицами сделана верстка, а они не адаптируются так как хотелось бы - ищите макет на слоях.


Поблагодарили: (2)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
sanika
sanika
Topic Starter сообщение 29.10.2014, 15:34; Ответить: sanika
Сообщение #4


Бывалый
****

Группа: User
Сообщений: 378
Регистрация: 5.1.2011
Поблагодарили: 96 раз
Репутация:   9  


CMS не мешает, но вот с джумлой не дружу. За фреймворк спасибо, поюзаю


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
mmkulikov
mmkulikov
сообщение 29.10.2014, 16:12; Ответить: mmkulikov
Сообщение #5


Старожил
******

Группа: Active User
Сообщений: 2027
Регистрация: 21.9.2012
Из: СССР
Поблагодарили: 587 раз
Репутация:   68  


Цитата(sanika @ 29.10.2014, 13:01) *
Хочу разобраться как он работает, а то с @media все понятно, а как на практике выглядит - не понимаю.

Вот делал когда-то на заказ, можете поизучать http://kmm.esy.es/other_jobs/alameal/
Все манипуляции только через style.css

Сообщение отредактировал mmkulikov - 29.10.2014, 16:14


--------------------


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
allvake
allvake
сообщение 29.10.2014, 18:09; Ответить: allvake
Сообщение #6


Завсегдатай
*****

Группа: Active User
Сообщений: 594
Регистрация: 16.8.2011
Из: South
Поблагодарили: 272 раза
Репутация:   37  


fredditton,
Цитата
Искал такой под Wordpress - не нашел.
не могу оценить полностью возможности для wp Wordpress Gantry Framework http://gantry-framework.org/ , но версия для джумлы этот фреймворк вещь отличная и еще cherryframework.com

Сообщение отредактировал allvake - 29.10.2014, 18:10


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Gerga
Gerga
сообщение 31.10.2014, 20:11; Ответить: Gerga
Сообщение #7


Участник
***

Группа: User
Сообщений: 247
Регистрация: 15.2.2013
Из: Одесса
Поблагодарили: 168 раз
Репутация:   43  


Вот пример: https://yadi.sk/d/QiVPNT_xcQxcP (html и css). Вот рабочий сайт: http://instasurf.ru/

Цитата
Это возможно лишь при верстке дивами или табличная тоже может быть адаптивной?

Все возможно, но не желательно.

html:
Развернуть/Свернуть
Код
<!DOCTYPE html>
<html class="no-js" lang="ru-RU">
<head>
    <meta charset="UTF-8" />
    <title>Название сайта</title>  
    <link rel="stylesheet" href="./style.css" type="text/css" media="screen" />
    <!--[if IE]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->                        
</head>
<body class="width_site">

    <header id="header">
        <div class="info_1 left">Меню 1</div>
        <div class="info_2 right">Меню 2</div>
    </header>
    <section id="content" class="inline_blck">Контент</section>
    <aside id="sidebar" class="inline_blck">Сайдбар</aside>
    <footer id="footer">Подвал</footer>
</body>
</html>


CSS:
Развернуть/Свернуть
Код
* {margin: 0; padding: 0}
body {color: #fff}
.width_site {
    width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}
#header {
    height: 200px;
    background: red;
}
#header > * {
    width: 400px;
    height: 60px;
    background: green;
}
#content {
    width: 70%;
    background: #000;
}
#sidebar {
    width: 30%;
    background: blue;
    margin-left: -4px;
}
.inline_blck {
    display: inline-block;
    vertical-align: top;
    height: 600px;
}
.left {float: left}
.right {float:  right}
#footer {
    background: orange;
}
/*Адаптивность*/
@media screen and (max-width:1050px){    
    .width_site {
        width: 90%;
    }
}
@media screen and (max-width:910px){    
    #header > *{
        float: none;
        margin-top: 10px;
    }
    #header > .info_2 {width: 100%}
}
@media screen and (max-width:750px){    
    #sidebar, #content {
        width: 100%;
        margin: 0;
    }
}


Сообщение отредактировал Gerga - 31.10.2014, 20:24


--------------------
Разработка на WordPress -> Верстка/Натяжка/Добавление функционала в шаблонах на WP


Поблагодарили: (2)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
iodjin
iodjin
сообщение 31.10.2014, 20:35; Ответить: iodjin
Сообщение #8


Завсегдатай
*****

Группа: Active User
Сообщений: 693
Регистрация: 19.8.2012
Поблагодарили: 201 раз
Репутация:   27  


Курите Bootstrap


--------------------


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Ищу авторов статей и рерайтеров на постоянку
7 eduarddis 657 Вчера, 22:41
автор: Yepperoni
Открытая тема (нет новых ответов) Ищу рерайтера
5 almmih1991 614 Вчера, 22:38
автор: Yepperoni
Открытая тема (нет новых ответов) Ищу ответственного редактора
ТЗ, заказ и проверка текстов
1 Kredshev 438 Вчера, 22:37
автор: Yepperoni
Открытая тема (нет новых ответов) Ищу платёжный агрегатор для работы с физ. лизами (не ИП)
21 SergeiVL 2866 12.12.2017, 16:26
автор: BestExchangers
Открытая тема (нет новых ответов)  Ищу работу
0 Fortunatus 336 11.12.2017, 21:02
автор: Fortunatus


 



RSS Текстовая версия Сейчас: 16.12.2017, 11:31
Дизайн