2017-12-27 4 views
-1

내 응용 프로그램의 github과 같은 바닥 글 페이지를 만들고 싶습니다. 내 응용 프로그램에 github과 같은 바닥 글 페이지 구성 요소를 만들려면 어떻게해야합니까?

나는 다음과 같은 바닥 글 요소가 있습니다

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

을 여기 템플릿입니다 :

<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에 하나 같이 바닥 글 페이지를 구축 할 수는?

+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>

난 당신이 같은