I do not know if that way this question is asked. Currently I have an index.html file where I have all the css and all the js necessary for the design but I have a folder called "views" and basically so that the design, in these new files that are in the vista folder, should be stopped. same way to import all the css and js necessary, that is to say to do the same configuration of the index.html. What I need is that when I enter a view, for example to "page 1" it will load in the div "page-content" that is in the index.html
This is the index.html
<!DOCTYPE HTML>
<title>Titulo</title>
<link rel="stylesheet" type="text/css" href="styles/style.css">
<link rel="stylesheet" type="text/css" href="styles/skin.css">
<link rel="stylesheet" type="text/css" href="styles/framework.css">
<link rel="stylesheet" type="text/css" href="styles/ionicons.min.css">
<link href='https://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="scripts/plugins.js"></script>
<script type="text/javascript" src="scripts/custom.js"></script>
</head>
<body>
<div id="page-transitions">
<div class="page-preloader page-preloader-dark">
<div class="spinner"></div>
</div>
<div class="header header-light">
<a href="index.html" class="header-logo">PMT <span class="color-red-dark">S.A</span></a>
<a href="#" class="header-icon header-icon-1 close-sidebar-mask"></a>
<a href="#" class="header-icon header-icon-1 open-sidebar">
<em class="line-1"></em>
<em class="line-2"></em>
<em class="line-3"></em>
</a>
</div>
<!-- Main Small Icon Sidebar -->
<div class="sidebar-menu sidebar-light">
<div class="sidebar-menu-scroll">
<a class="current-menu" href="index.html"><i class="ion-ios-star-outline"></i><em>Apoyo</em></a>
<a data-submenus="sub1" href="#"><i class="ion-ios-home-outline"></i><em>Inicio</em></a>
<a data-submenus="sub2" href="#"><i class="ion-ios-gear-outline"></i><em>Mas</em></a>
</div>
</div>
<!-- Home Submenus -->
<div class="submenu submenu-light" id="sub1">
<div class="submenu-scroll">
<a class="close-sidebar" href="#"><i class="ion-ios-close-empty"></i><em>Cerrar</em></a>
<a href="index.html"><i class="ion-ios-star-outline"></i><em>Pagina 1</em></a>
<a href="index-classic.html"><i class="ion-ios-home-outline"></i><em>Pagina 2</em></a>
<a href="index-classic.html"><i class="ion-ios-home-outline"></i><em>Pagina 3</em></a>
</div>
</div>
<!-- Features Submenus -->
<div class="submenu submenu-light" id="sub2">
<div class="submenu-scroll">
<a class="close-sidebar" href="#"><i class="ion-ios-close-empty"></i><em>Cerrar</em></a>
<a href="features-tabs.html"><i class="ion-ios-more-outline"></i><em>Información</em></a>
<a href="features-toggles.html"><i class="ion-ios-toggle-outline"></i><em>Cerrar Sesión</em></a>
</div>
</div>
<div id="page-content" class="header-clear-large">
<div id="page-content-scroll"><!--Enables this element to be scrolled -->
<div class="content">
<img data-original="images/1.png" alt="img" class="preload-image responsive-image full-bottom" src="images/empty.png" >
<h2 class="center-text thiner half-bottom">Esto es la pagina principal</h2>
<p class="center-boxed-text center-text half-bottom">
</p>
</div>
<div class="clear"></div>
<div class="decoration decoration-margins"></div>
<div class="footer footer-dark">
<a href="index.html" class="footer-logo scale-hover"></a>
<p>
</p>
<div class="decoration"></div>
<p class="copyright-text"> |<span id="copyright-year"></span>..</p>
</div>
</div>
</div>
<a href="#" class="back-to-top-badge"><i class="ion-android-arrow-dropup"></i>Volver arriba</a>
</div>
<!-- Script - Controladores -->
<script type="text/javascript" src="scripts/controllers/login.js"></script>
<!---------------------------->
</body>
Thank you very much.