详解在 Angular 项目中添加 clean-blog 模板

本篇文章主要介绍了详解在 Angular 项目中添加 clean-blog 模板，非常具有实用价值，需要的朋友可以参考下

在 Angular 项目中添加 clean-blog 模板

clean-blog 博客模板下载

clean-blog

或者在下面链接下载

startbootstrap-clean-blog-4-dev.zip

解压并拷贝

解压下载的文件,将所有文件拷贝到 assets/clean-blog 目录下

拷贝代码

将 clean-blog 的 index.html 内容拷贝到 app.component.html

   Start Bootstrap   Home
 About
 Sample Post
 Contact
     Clean Blog
A Blog Theme by Start Bootstrap
      Man must explore, and this is exploration at its greatest 
 Problems look mighty small from 150 miles up Posted by Start Bootstrap on September 24, 2017
   I believe every human has a finite number of heartbeats. I don't intend to waste any of mine. Posted by Start Bootstrap on September 18, 2017
   Science has not yet mastered prophecy 
 We predict too much for the next year and yet far too little for the next ten. Posted by Start Bootstrap on August 24, 2017
   Failure is not an option 
 Many say exploration is part of our destiny, but it's actually our duty to future generations. Posted by Start Bootstrap on July 8, 2017
        
   
   
Copyright © Your Website 2017

styles.css 添加代码

 /* clean-blog */ @import "assets/clean-blog/vendor/font-awesome/css/font-awesome.min.css"; @import "https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic"; @import "https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800"; @import "assets/clean-blog/css/clean-blog.min.css"; .navbar-toggler { z-index: 1; } @media (max-width: 576px) { nav > .container { width: 100%; } }

index.html 添加 JS 引用

结果