File size: 6.75Kb
<!DOCTYPE html>
<html lang="ru">
<head>
<!-- <meta name="viewport" content="width=device-width, initial-scale=1" /> -->
<title>Заголовок страницы</title>
<link rel="stylesheet" href="style/style.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<body>
<div id="mySidenav" class="sidenav">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a>
<div style="background: url(style/img/8.png) center; background-size: 200% auto" class="nav_obl">
<span class="obl_ava">
<img src="style/img/4.png" alt="">
</span>
<span class="obl_nik">
<b>Marc-zi</b>
</span>
</div>
<div class="obl_nav">
<a href="story.html" onclick="closeNav()">Мой акаунт</a>
<a href="#">Настройки</a>
<a href="#">Выход</a>
</div>
<div class="obl_nav">
<a href="#" onclick="closeNav()">Сообщения</a>
<a href="#">Мои группы</a>
<a href="#">Фотоальбомы</a>
<a href="#" onclick="closeNav()">Мои видео</a>
<a href="#">Моя музыка</a>
</div>
<div class="obl_nav">
<a href="#" onclick="closeNav()">Видео</a>
<a href="#">Музыка</a>
<a href="#">Чат</a>
<a href="#" onclick="closeNav()">Хуета</a>
<a href="#">И таранта</a>
</div>
</div>
<div class="head width">
<table>
<td width="40px"><a href="#"><span style="font-size:30px;cursor:pointer" onclick="openNav()"><span class="material-icons">menu</span></span></a></td>
<td width="80%">Anifan.fun</td>
<td width="40px"><a href="#"><span class="material-icons">notifications_none </span><span class="none">2</span></a></td>
<td><a href="#"><span class="material-icons" >search</span></a> </td>
</table>
</div>
<div class="margin-botton"></div>
<div class="list">
<center><div class="list_optimize">
<table>
<td><a href="index.html">Блог</a></td>
<td><a href="groups.html">Группы</a></td>
<td><a class="list_a" href="story.html">Сторис</a></td>
<td><a href="fan-art.html">Фан-арт</a></td>
</table>
</div></center>
</div>
<div class="content">
<div class="post">
<div class="post_nik">
<table width="100%">
<td width="45px"><img class="post_ava" src="style/img/1.png" alt=""></td>
<td><a href="#">Marc</a> <br> <i>20 июля в 20.17</i></td>
</table>
</div>
<center>
<div class="post_img1">
<a href="#"><img src="style/img/2.png" alt=""></a>
</div>
</center>
<div class="post_like">
<table width="100%">
<td><a href="#"><span class="material-icons">reply </span></a></td>
<td><a href="#"><span class="material-icons">mode_comment </span></a></td>
<td><a href="#"><span class="material-icons">thumb_up_alt </span>567</a></td>
</table>
</div>
</div>
<div class="post">
<div class="post_nik">
<table width="100%">
<td width="45px"><img class="post_ava" src="style/img/1.png" alt=""></td>
<td><a href="#">Marc</a> <br> <i>20 июля в 20.17</i></td>
</table>
</div>
<center>
<div class="post_img2">
<a href="#"><img src="style/img/4.png" alt=""></a>
<a href="#"><img src="style/img/3.png" alt=""></a>
</div>
</center>
<div class="post_like">
<table width="100%">
<td><a href="#"><span class="material-icons">reply </span></a></td>
<td><a href="#"><span class="material-icons">mode_comment </span></a></td>
<td><a href="#"><span class="material-icons">thumb_up_alt </span>45</a></td>
</table>
</div>
</div>
<div class="post">
<div class="post_nik">
<table width="100%">
<td width="45px"><img class="post_ava" src="style/img/1.png" alt=""></td>
<td><a href="#">Marc</a> <br> <i>20 июля в 20.17</i></td>
</table>
</div>
<center>
<div class="post_img3">
<a href="#"><img src="style/img/4.png" alt=""></a>
<a href="#"><img src="style/img/3.png" alt=""></a>
<a href="#"><img src="style/img/2.png" alt=""></a>
<a href="#"><img src="style/img/6.png" alt=""></a>
<a href="#"><img src="style/img/1.png" alt=""></a>
</div>
</center>
<div class="post_like">
<table width="100%">
<td><a href="#"><span class="material-icons">reply </span></a></td>
<td><a href="#"><span class="material-icons">mode_comment </span></a></td>
<td><a href="#"><span class="material-icons">thumb_up_alt </span>45</a></td>
</table>
</div>
</div>
<div class="post">
<div class="post_nik">
<table width="100%">
<td width="45px"><img class="post_ava" src="style/img/1.png" alt=""></td>
<td><a href="#">Marc</a> <br> <i>20 июля в 20.17</i></td>
</table>
</div>
<center>
<div class="post_img4">
<a href="#"><img src="style/img/4.png" alt=""></a>
<a href="#"><img src="style/img/3.png" alt=""></a>
<a href="#"><img src="style/img/2.png" alt=""></a>
<a href="#"><img src="style/img/6.png" alt=""></a>
<a href="#"><img src="style/img/1.png" alt=""></a>
<a href="#"><img src="style/img/4.png" alt=""></a>
<a href="#"><img src="style/img/3.png" alt=""></a>
<a href="#"><img src="style/img/2.png" alt=""></a>
<a href="#"><img src="style/img/6.png" alt=""></a>
<a href="#"><img src="style/img/1.png" alt=""></a>
</div>
</center>
<div class="post_like">
<table width="100%">
<td><a href="#"><span class="material-icons">reply </span></a></td>
<td><a href="#"><span class="material-icons">mode_comment </span></a></td>
<td><a href="#"><span class="material-icons">thumb_up_alt </span>45</a></td>
</table>
</div>
</div>
</div>
<div class="navigation">
<center>
<a class="nav-a" href="#">1</a>
<a class="nav-b" href="#">2</a>
<a class="nav-a" href="#">3</a>
<a class="nav-a" href="#">4</a>
<a class="nav-a" href="#">32</a>
</center>
</div>
<script> function openNav() { document.getElementById("mySidenav").style.width = "250px"; } function closeNav() { document.getElementById("mySidenav").style.width = "0"; } </script>
</body>
</html>