2017-12-27 1 views
-1

私のアプリケーション用のgithubのようなフッターページを作りたいと思います。アプリケーションのgithubのようなフッターページコンポーネントをビルドするにはどうしたらいいですか?

私は次のようにフッター成分を有する:

<div class="footer"> 
    <div class="m-container m-container--fluid m-container--full-height m- 
    page__container"> 
    <li class="m-nav__item"> 
     <span class="m-footer__copyright"> 
      Copyrights &copy; {{ today | date: 'yyyy' }} MINEPAT, Mountain Metrics by 
      <a href="#" class="m-link">Mountain</a> 
     </span> 
     <a href="#" class="m-nav__link"> 
      <span class="m-nav__link-text">About</span> 
     </a> 
     <a href="#" class="m-nav__link"> 
       <span class="m-nav__link-text">Terms</span> 
      </a>    
     <a href="#" class="m-nav__link"> 
      <span class="m-nav__link-text">Privacy</span> 
     </a> 
     <a href="#" class="m-nav__link"> 
      <span class="m-nav__link-text">Contact Editor</span> 
     </a> 
     <a href="#" class="m-nav__link"> 
      <span class="m-nav__link-text">Help</span> 
     </a> 
    </li>   
</div> 

どのように私はgithubののようなフッタページを作成することができます

@Component({ 
selector: 'app-footer', 
templateUrl: './footer.component.html' 
}) 
export class FooterComponent { 
    today: number = Date.now(); 
} 

、ここではテンプレートですか?

+0

のようなものを作成したいのですが、どこに問題がありますか? – FIL

+0

@FIL、このプレゼンテーションを改善して、Githubのように見せてください – echoupe

+0

あなたの質問はHTMLマークアップ、CSSスタイリング、または角度の基礎について言及していますか? – FIL

答えて

0

ul { 
 
    display:flex; 
 
    justify-content:center; 
 
} 
 
li { 
 
    display:block; 
 
    padding-right:10px; 
 
} 
 

 
.item-2 { 
 
    margin-right:auto; 
 
    margin-left:auto; 
 
}
<ul> 
 
    <li>Item 1</li> 
 
    <li class="item-2">Item 2</li> 
 
    <li>Item 3</li> 
 
</ul>

私はあなたの質問からあなたを理解していれば、あなたは[OK]を、この

関連する問題