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

怎么在Angular项目中添加 clean-blog 模板?相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。

成都创新互联公司主要从事成都网站设计、网站建设、网页设计、企业做网站、公司建网站等业务。立足成都服务潘集,十载网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:18980820575

clean-blog 博客模板下载

clean-blog

或者在下面链接下载

startbootstrap-clean-blog-4-dev.zip

解压并拷贝

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

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

拷贝代码

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





 
  
   Menu 
  
  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

       
            Older Posts →         
                                                                                                                                                                                                                 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 引用


结果

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

提示: 文中的配置只是把 clean-blog 给搭建在 Angular4 的项目中,但是并没有大改其中的东西,比如链接等,现在还是一个静态的网页,后期才会添加自己的代码上去

看完上述内容,你们掌握怎么在Angular项目中添加 clean-blog 模板的方法了吗?如果还想学到更多技能或想了解更多相关内容,欢迎关注创新互联行业资讯频道,感谢各位的阅读!


名称栏目:怎么在Angular项目中添加clean-blog模板
本文地址:http://cdiso.cn/article/igsgci.html