将HTML导入HTML

Question

I need to import A.html and B.html and C.html into Index.html

The way that I tried.....it can work, but dont know way only one is normal, other not link with their css

---

below is my index.html

it can work, but only D.html is link its css. Others looks not right layout with their css.

<link rel="stylesheet" href="css/index.css">
<link rel="stylesheet" href="css/A.css">
<link rel="stylesheet" href="css/B.css">
<link rel="stylesheet" href="css/C.css">
<link rel="stylesheet" href="css/D.css">


<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js" defer></script>
<section ng-app="">
  <div ng-include="'section/A.html'"></div>
  <div ng-include="'section/B.html'"></div>
  <div ng-include="'section/C.html'"></div>
  <div ng-include="'section/D.html'"></div>
</section>

Answer 1

here is a codepen project I did to help you with your issue: https://codepen.io/ideaguy3d/project/editor/AdzPdm

I just added an angular app and pointed ng-app to it:

app.js:

angular.module('myApp', []);

index.html:

```

   <section ng-app="myApp">

        <div ng-include="'section/A.html'"></div>
        <div ng-include="'B.html'"></div>

    </section>

```

Make sure there is a folder called "section" in your project as well.