Куда в код надо внести изменения, чтобы была мобильная версия?

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>PayForInstall.ru</title>
	<script type="text/javascript" src="/js/jquery.min.js"></script>
	<script type="text/javascript" src="/js/script.js"></script>
	<script type='text/javascript' src='/js/jquery.scrollTo-1.4.3.1.js'></script>
   
	<link rel="stylesheet" href="css/style.css">
	<link rel="stylesheet" href="css/mobile.css" media="only screen and (max-device-width:480px)"/>
	<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>
</head>
<body>
	<header class="header">
		<div class="top"><!--top-->
			<div class="wrap">
				<div class="logo">
					<a href="/"></a>
				</div>
				<div class="head-menu">
					<ul>
						<li><a href="login/this_avto.php">Войти</a></li>
						<li><a href="login/register.php">Регистрация</a></li>
						<li><a class="two" href="#2">Как это работает?</a></li>
						<li><a class="two" href="#3">Часто задаваемые вопросы</a></li>
						<div class="clear"></div>
					</ul>
				</div>
				<div class="clear"></div>
			</div>
		</div><!--top-->
		<div class="wrap">
			<h1>Скачивай приложения</h1>
			<h1>и получай за это деньги</h1>
			<div class="regist"><!--regist-->
				<div class="text-bl">
				</div>
				<div class="include">
					
				</div>
			</div><!--regist-->
		</div>
	</header>
	<section id="2" class="work"><!--work-->
		<div class="wrap">
			<h1>Как это работает</h1>
			<div class="work-block"><!--work-block-->
				<div class="point p1">
					<p>Регистрируйся</p>
					<p>Пройди простую регистрацию - укажи<br>e-mail и номер телефона, пароль<br>придет на почту.</p>
				</div>
				<div class="hand"></div>
				<div class="point p2">
					<p>Скачивай</p>
					<p>Выбирай приложения из списка,<br>загружай их и получай за это<br>деньги на свой счет.</p>
				</div>
				<div class="hand"></div>
				<div class="point p3">
					<p>Зарабатывай</p>
					<p>Заработанные деньги можно<br> вывести на баланс телефона,<br> либо на QIWI-кошелек.</p>
				</div>
				<div class="clear"></div>
			</div><!--work-block-->
		</div>
	</section><!--work-->


* {
	margin: 0;
	padding: 0;
}
html{
	height: 100%;
	width: 100%;
	}
body{
	position: relative;
	background-repeat: repeat;
	font-family: 'PT Sans', sans-serif;
}
input, button, textarea {
	outline: none;
	border: 0;
}
input[type="submit"], button{
	cursor: pointer;
	display: block;
}

input[type="text"]{
	display: block;
}
b{
	display: block;
	font-weight: normal;
}
h1, h2, h3, h4, h5, h6{
	font-weight: normal;
}
section, header, footer{
	position: relative;
	min-width: 1100px;
	width: 100%;
	background-position: center top;
	background-repeat: no-repeat;
}
a, img{
	display: block;
	text-decoration: none;
}
ul{
	list-style: none;
}

:focus::-webkit-input-placeholder { 
	color: transparent;
}

:focus::-moz-input-placeholder { 
	color: transparent;
}
:focus::-input-placeholder { 
	color: transparent;
}



.wrap{
	width: 1060px;
	margin: auto;
	min-width: 1060px;
}
.wrapper{
	width: 1022px;
	margin: auto;
	min-width: 1022px; 
}
.clear{
	clear: both;
}

/*=======================================================*/

header{
	background-color: #2c3e50;
}
.header{
	padding-bottom: 63px;
}
header .top{
	height: 76px;
	border-bottom: 1px solid #263545;
}
.logo{
	float: left;
	padding-top: 20px;
}
.logo a{
	background: url(../img/logo.png) 0 0 no-repeat;
	width: 233px;
	height: 37px;
}
.head-menu{
	float: right;
	margin-top: 17px;
}
.head-menu ul li,
.head-menu2 ul li{
	float: left;
}
.head-menu ul li a,
.head-menu2 ul li a{
	color: #7e95ae;
	font-family: 'PT Sans', sans-serif;
	font-size: 15px;
	border-radius: 5px;
	border: 2px solid transparent;
	padding: 10px 15px 10px 15px; 
}
.head-menu ul li a:hover{
	color: #fff;
	border: 2px solid #fff;
}
header h1{
	text-align: center;
	color: #fff;
	font-size: 55px;
    font-family: 'PT Sans', sans-serif;
}
header h1:first-child{
	font-size: 72px;
	padding-top: 47px;
}


Куда надо внести изменения, чтобы была мобильная версия?
  • Вопрос задан
  • 2958 просмотров
Решения вопроса 1
batChar
@batChar
jQuery Mobile в помощь.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы