Django

Django Bootstrap, Fontawesome

zhelddustmq 2024. 8. 22. 09:31

01. Bootstrap

02. Fontawesome

 

 

01. Bootstrap: https://getbootstrap.com

 

Bootstrap

Powerful, extensible, and feature-packed frontend toolkit. Build and customize with Sass, utilize prebuilt grid system and components, and bring projects to life with powerful JavaScript plugins.

getbootstrap.com

  1. base.html의 head에 위 사진 속 CSS 링크를 첨부
  2. base.html의 body 마지막줄에 JS 링크를 첨부
  3. 사이트 속 사용법을 참고하여 원하는 것을 코드에 적용

02. Fontawesome: https://fontawesome.com/

 

Font Awesome

The internet's icon library + toolkit. Used by millions of designers, devs, & content creators. Open-source. Always free. Always awesome.

fontawesome.com

  • 좋아요 버튼 만들기
    1. base.html의 head에 Bootstrap 링크아래에 첨부
    2. 검색하여 원하는 아이콘을 찾고, 복사하여 코드에 첨부

btn: 안에 있는 객체들을 버튼형태로. btn-link: 버튼을 링크형식으로. text-danger: 빨간색으로 덧칠하기