St991Cup's Blog

Steelcup, St991cup, steelcup

Tailwind CSS

  • CSS Display와 Spacing 완벽 가이드

    “Claude 생성 문서” Display 속성의 기본값 display 속성의 기본값은 요소마다 다릅니다. Block 요소 (display: block) <div>, <p>, <h1>~<h6>, <ul>, <ol>, <li><header>, <footer>, <section>, <article><form>, <table> Inline 요소 (display: inline) <span>, <a>, <strong>, <em>, <b>, <i><code>, <small> Inline-block 요소 <img>, <button>, <input>, <select>, <textarea> 핵심: <div>는 기본값이 display: block이므로, 따로 지정하지 않아도 block으로 동작합니다. Grid의 gap… Continue reading

    , ,

  • VS Code Tailwindcss + NextJs Prettier formatter 셋업 가이드

    VS Code 환경 설정 Visual Studio Code 설치 https://code.visualstudio.com/download Next, Tailwindcss 관련 플러그인 설치 참고 https://tailwindcss.com/docs/editor-setup#intelli-sense-for-vs-code VS Code Extension https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss Prettier 플러그인 설치 https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode 프로젝트 셋업 프로젝트 생성 “npx create-next-app@latest” 커맨드를 실행하면 가이드가 나온다. 아래와 같이 Typescript + Tailwind + Eslint를 사용한다. $ npx create-next-app@latest✔ What is your project named? … project-name✔ Would you like… Continue reading

    , ,
워드프레스닷컴으로 이처럼 사이트 디자인
시작하기