김평범's OrdinaryCode

  • 홈
  • 태그
  • 방명록

vue레이아웃 1

[Vue.js/Nuxt] vue-masonry-css를 이용해서 카드레이아웃 구현하기

📌masonry Layout masonry는 건물의 벽, 돌벽 등으로 벽돌을 쌓는 공사를 말한다. 보통 이런 레이아웃은 핀터레스트 스타일이라고 해서 높이가 다른 각자의 카드들을 높이에 맞춰 딱딱 들어맞는 형식의 레이아웃이다. 👩‍💻vue프로젝트에서 masonry 레이아웃 이용하기 실제로 만들려면, npm 중에 vue-masonry-css를 이용하면 손쉽게 적용할 수 있다. vue-masnory-css vue에서 masnory 레이아웃을 만들어줄 npm이 존재한다. 사용방법은 그냥 npm install만 해주면 된다. npm i vue-masonry-css --save plugins/client.js import Vue from 'vue' import VueMasonry from 'vue-masonry-c..

FrontEnd/Vue.js 2022.04.30
1
더보기
  • 분류 전체보기 (182)
    • Diary (4)
    • FrontEnd (93)
      • Javascript (20)
      • Vue.js (28)
      • css (17)
    • etc. (83)
      • Notion (70)

Tag

노션템플릿, 노션유용한템플릿, 노션, Vue, 노션템플릿공유, 노션무료템플릿, Notion템플릿공유, react, 노션활용법, 노션표, NUXT, 노션가계부, JavaScript, 자바스크립트, 노션수식, 노션가이드, notion, 노션데이터베이스, CSS, 노션사용법,

최근글과 인기글

  • 최근글
  • 인기글
  • [JavaScript] 빈 객체 확인하는 방법 (object 빈 객체 체크) 2022.12.26 20:06
  • [Notion] 데이터 베이스 하위 항목 넣기 (노션 표 하위 항목을 이용한 WBS 작성하기) 2022.12.19 22:11
  • nuxt mounted 2번씩 호출 될때 (mounted twice when render) 2022.12.08 21:05
  • 개인이 노션 잘 활용하는 방법 5가지 - 노션 첫 사용하는 분을 위한 글 2021.04.02 22:46
  • [Notion]노션을 이용하여 개인용 포트폴리오 및 이력서 작성하기(신입, 경력직 포트폴리오 템플릿 공개) 2021.02.03 21:38
  • [Notion] 노션 페이지 전체 화면 채우는 방법과 노션 글씨 크기 및 폰트 설정 2021.03.25 20:35

최근댓글

  • 고양이 관리 기록용 노션 템플릿을 찾다가 왔어요! 감사히 쓰겠습니다.

    백에린

  • 와 채점기능까지 대단하세요 감사히 잘 활용하겠습니다!!

    카야

  • 가나다 오됐다 ㅋㅋㅋ 감사합니다!

    dd

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

  • 2022/12
  • 2022/11
  • 2022/10
  • 2022/08
  • 2022/07

Calendar

«   2023/01   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31

Copyright © Kakao Corp. All rights reserved.

티스토리툴바